在控制器分配新值后,AngularJS隔离范围不会更新

时间:2014-11-06 13:40:15

标签: javascript angularjs

我的应用程序中有一个控制器,它在$ http调用后分配一个值。

我希望我的指令反映该值的变化,但是$ watch没有看到变化。我在隔离范围上使用双向绑定来尝试查看该值的变化。

所以对于控制器我有

angular.module('myApp', [])
  .controller('myCtrl', ['$scope', '$http', function ($scope, $http) {

    console.log('first point');

    $http.get('some/URL').success(function(data) {
        $scope.response = data;
        $scope.chartValues = $scope.response.data;
        console.log('chartValues assigned');
    });
    console.log('second point');
}]);

现在我的指示中有

angular.module('myDirectives, [])
  .directive('myChart', [function() {
    return {
        template: '<h3>hello</h3>',
        restrict: 'EA',
        scope: { data: '=chartData' },
        link: function (scope, element, attrs) {

          scope.$watch('scope.data', function (newVals) {
            console.log('data was changed!');
            console.log(newVals);
          }, true);
    }
} 

部分包含:

<my-chart chart-data="chartValues"></my-chart>

控制台将记录:

first point
second point
data was changed!
undefined
chartValues assigned

它就在那里停止。似乎范围。$ watch没有注意到chartValues已更新,即使我已告知隔离范围中的“数据”与父范围中的chartValues同步。

2 个答案:

答案 0 :(得分:1)

使用

scope.$watch('data', function (newVals) {

而不是

scope.$watch('scope.data', function (newVals) {

答案 1 :(得分:1)

您的问题似乎是'data'您应该使用'scope.data'

所以它看起来像scope.$watch('scope.data', function (newVals)