角度指令双向范围不更新模板

Question

我有一个角度指令esResize，我在使用隔离作用域上的双向绑定时遇到问题。

window.estimation.directive('esResize', function() { 
    return { 
     restrict:'C', 
     scope: { 
      pointGrid: '=' 
     }, 
     template: "<h2>{{ pointGrid }}</h2><ul><li ng-repeat='card in pointGrid track by $id(card)'>{{ card }}</li></ul>", 
     controller: function($scope) { 
      $scope.shiftTicket = function() { 
       $scope.pointGrid.push("New Ticket"); 
      }; 
     }, 

     link: function(scope, element, attrs) { 
      var height;  
      element.resizable({ 
       grid: [ 10, 20 ], 
       handles: "n, s", 
       start: function(event, ui) { 
        //initialize method 
       }, 
       resize: function(event, ui) { 
        scope.shiftTicket(); 
       } 
      }); 
     } 
    }; 
}); 

当resize被触发，pointGrid有“新票”推到它时，我将它输出到控制台。但是，该模板不会更新。我误解了绑定是如何链接到视图的，或者在这里有什么其他的东西吗？

编辑：pointGrid在视图中只是一个数组。

Answer 1

在更新jquery插件回调中的范围值后，您需要调用$scope.$apply();。这是因为它在角度自己的周期内没有触发，因为它会使用ng-click或$ http回调。

resize: function(event, ui) { 
    scope.shiftTicket(); 
    scope.$apply(); // Should tell angular that this has updated 
}