Edit in JSFiddle

angular.module('myApp', [
  'ui.router',
  'ngAnimate'
  ])
  
  .controller('AppCtrl', ['$scope', 'blockConfig', function ($scope, blockConfig) {
    $scope.title = 'MyApp';
    $scope.config = blockConfig;
  }])
  
  .controller('StateACtrl', ['$scope', 'blockConfig', function ($scope, blockConfig) {
    $scope.enabled = blockConfig.enabled;
  }])
  
  .controller('StateBCtrl', ['$scope', 'blockConfig', function ($scope, blockConfig) {
    $scope.enabled = blockConfig.enabled;
  }])
  
  .directive('directive', function () {
   return {
     restrict: 'E',
     replace: true,
     scope: {
       config: '='
     },
     template: '<div class="directive"><p>Inside directive enabled = {{config.enabled}}, collapsed = {{config.collapsed}}</p><a class="toggle-side-panel" ng-click="toggle()">close</a></div>',
     controller: ['$scope', function ($scope) {
       $scope.collapsed = false;
       $scope.toggle = function () {
         $scope.config.collapsed = !$scope.config.collapsed;
       }
     }]
   };
  })
  
  .config(['$stateProvider', function ($stateProvider) {
    $stateProvider
    
      .state('app', {
        abstract: true,
        template: '<h1>{{title}}</h1><div ng-class="{\'is-collapsed\': config.collapsed}"><directive config="config" ng-if="config.enabled"></directive><div ui-view></div></div>',
        controller: 'AppCtrl',
        resolve: {
          blockConfig: function () {
            return {
              enabled: null,
              collapsed: false
            };
          }
        }
      })
      
      .state('app.stateA', {
        url: '',
        template: '<p class="state stateA">State A, blockConfig.enabled = {{enabled}}</p>',
        controller: 'StateACtrl',
        resolve: {
          blockConfig: ['blockConfig', function (blockConfig) {
            blockConfig.enabled = false;
            return blockConfig;
          }]
        }
      })
      
      .state('app.stateB', {
        url: '/stateB',
        template: '<p class="state stateB">State B, blockConfig.enabled = {{enabled}}</p>',
        controller: 'StateBCtrl',
        resolve: {
          blockConfig: ['blockConfig', function (blockConfig) {
            blockConfig.enabled = true;
            return blockConfig;
          }]
        }
      });
  }]);
<div ng-app="myApp" ng-class="{'disable-anims': disableAnims}">
    {{title}}
  <a ui-sref="app.stateA">State A</a> <a ui-sref="app.stateB">State B</a>
    <div ui-view></div>
</div>