$ смотреть не обновляя подвид

Question

У меня есть эта директива, которая изменяет $scope.mode в родительском $scope:

angular.module('Selector', []).directive('mySelector', function() { 
    var changeMode; 
    changeMode = function(newmode) { 
    var $scope; 
    $scope = this; 
    $scope.mode = newmode; 
    $('.menu-open').attr('checked', false); 
    return $scope.mode; 
    }; 
    return { 
    restrict: 'E', 
    scope: { 
     mode: '=mode', 
     id: '@id' 
    }, 
    replace: true, 
    templateUrl: './directives/modeSelector/Selector.tpl.html', 
    link: function(scope, element, attrs) { 
     scope.changeZoneMode = changeMode; 
     return scope.$watch((function() { 
     return scope.mode; 
     }), function(newMode) { 
     return scope.mode = newMode; 
     }); 
    } 
    }; 
}); 

эта директива включена в main.html, а также Ui ракурса, загружающий подтаблицы:

<my-selector mode="current.Mode" id="{{current.ID}}"></my-selector> 
<!-- This binding works and updates properly --> 
{{current.Mode}} 

<!-- Subview container --> 
<div ui-view="sub"></div> 

subviewTemplate.html:

<!-- This binding doesn't work! --> 
{{current.Mode}} 

подтаблицы не имеет определенный контроллер, и он использует родительский один, так как из настроек в app.js:

.state('app.details', { 
    name: 'appDetails', 
    url: '/:zoneID', 
    views: { 
    'appContent': { 
     templateUrl: 'main.html', 
     controller: 'ctrl' 
    } 
    } 
}).state('app.details.overview', { 
    name: 'appDetailsOverview', 
    url: '/details', 
    views: { 
    'appContent': { 
     templateUrl: 'main.html', 
     controller: 'ctrl' 
    }, 
    'sub': { 
     templateUrl: 'subviewTemplate.html', 
     controller: 'ctrl' 
    } 
    } 
}); 

и контроллер, используемый как основной. HTML и subviewTemplate.html:

angular.module('myController', ['services']).controller('ctrl', [ 
    '$scope', 'Data', function($scope, Data) { 

    $scope.current = new Data; 
    $scope.current.load(); 

    return $scope.$watch('current.Mode', (function(newValue, oldValue) { 
     console.log('Old value is: ' + oldValue); 
     $scope.current.Mode = newValue; 
     return console.log('new value is: ' + $scope.currentMode); 
    }), true); 
    } 
]); 

Я не понимаю, почему он работает на main.html, обновляется правильно, но не на subviewTemplate.html. console.log внутри $watch печатает правильное значение.

Любая помощь? Что я здесь делаю неправильно?

Answer 1

Вы инициализируете новый экземпляр контроллера ctrl. Удалите эту строку, и она будет использовать родительский контроллер, который будет ctrl. Например:

'sub': { 
    templateUrl: 'subviewTemplate.html' 
}