1

我有一个 javascript 网格库 slickgrid 的指令。

http://plnkr.co/edit/KWZ9i767ycz49hZZGswB?p=preview

我想要做的是将选定的行传回控制器。所以我想使用隔离范围（使用'='）来获得控制器和指令之间的双向绑定。

如果我在没有任何范围声明的情况下定义指令，一切正常：

<slickgrid id="myGrid" data="names" selected-item="selectedItem"></slickgrid>

app.directive('slickgrid', function() {
  return {
  restrict: 'E',
  replace: true,
  //scope: {
  //  selectedItem: '='
  //},
  template: '<div></div>',
  link: function($scope, element, attrs) {
   ...
    var redraw = function(newScopeData) {
    grid.setData(newScopeData);
    grid.render();
};
$scope.$watch(attrs.data, redraw, true);

但是，如果我取消注释上面的行（app.js 中的第 19-21 行），它看起来就像 $scope.$watch 正在监视 attrs.data 对象正在调用重绘，但 attrs.data 被传入未定义。

我的分析可能是错误的，但我不确定为什么定义范围会导致这种情况。有人可以解释为什么会这样吗？

.内森。

4

1 回答 1

1

如果您定义了一个隔离范围，那么您指令中的任何 $watch 都将在您的隔离范围上寻找任何attrs.data评估结果。 attrs.data评估为 string names，因此 $watch 正在寻找$scope.names您的隔离范围，该范围不存在。（没有隔离范围，该指令使用与 MainCtrl 相同的范围，并且$scope.names存在于那里。）

要使用隔离范围，您需要定义另一个隔离范围属性以传入names：

scope: {
  selectedItem: '=',
  data: '='
},
...
$scope.$watch('data', redraw, true);

HTML 可以保持不变。

于 2013-03-15T20:03:36.780 回答