Change nav-bar background color dynamically in the state

I have a list of elements in my Ionic 1 app. When i select one or more of them I show some buttons to modify the element in the nav-bar. I also want that the nav-bar background-color changes, but I can’t find a solution for this.

Here is my code:

<ion-nav-bar class="bar-positive" ng-if="!edit_activity">
      <ion-nav-buttons side="left">
          <button class="button button-icon button-clear ion-navicon ink" menu-toggle="left" ng-show="!edit_activity"></button>
      </ion-nav-buttons>
      <ion-nav-buttons side="right">
           <button class="button button-icon button-clear ion-funnel ink" ng-show="is_admin && !edit_activity" ng-click="openModal(1)"></button>
           <button ng-if="sync_active" class="button button-icon button-clear ion-loop ink" ng-click="loadActivity()" ng-show="!edit_activity"></button>
     </ion-nav-buttons>
</ion-nav-bar>
<ion-nav-bar class="activity-edit-bg" ng-show="edit_activity">
      <ion-nav-buttons side="left">
           <button class="button button-icon button-clear ion-android-arrow-back ink" ng-click="revertSelection()" ng-show="edit_activity"></button>
     </ion-nav-buttons>
     <ion-nav-buttons side="right">
           <button class="button button-icon button-clear ion-trash-b" ng-click="deleteActivity()" ng-show="edit_activity && selected_activities.length < 2"></button>
          <button class="button button-icon button-clear ion-edit" ng-click="editActivity()" ng-show="edit_activity && selected_activities.length < 2"></button>
          <button class="button button-icon button-clear fa fa-gavel ink" ng-show="edit_activity" ng-click="changeToExecutedStatus()"></button>
     </ion-nav-buttons>
</ion-nav-bar>

I have already tried other solutions but this is the one that seems to work the most. When I select an item in the list the navbar changes correctly but when I deselect it the buttons are not shown and the console give me this error:

TypeError: Cannot read property 'outerHTML' of null
    at pre (http://localhost:8102/bower_components/ionic/release/js/ionic-angular.min.js:18:7812)
    at Y (http://localhost:8102/bower_components/angular/angular.min.js:73:89)
    at S (http://localhost:8102/bower_components/angular/angular.min.js:61:363)
    at g (http://localhost:8102/bower_components/angular/angular.min.js:54:384)
    at S (http://localhost:8102/bower_components/angular/angular.min.js:61:498)
    at g (http://localhost:8102/bower_components/angular/angular.min.js:54:384)
    at http://localhost:8102/bower_components/angular/angular.min.js:53:444
    at http://localhost:8102/bower_components/angular/angular.min.js:55:375
    at s (http://localhost:8102/bower_components/angular/angular.min.js:60:198)
    at Object.fn (http://localhost:8102/bower_components/angular/angular.min.js:252:335) <ion-nav-buttons side="left" class="hide">

Could someone help me?