2

问题

我发现 ng-repeat 指令无法跟踪新数组的添加。
在我的示例中,新数组是“选项”。
该指令是使用 ng-dialog(第 3 方库)显示的模板的一部分。
如果我关闭对话框并再次打开它,ng-repeat 将获取我在关闭它之前所做的那些更改。

我试过 $scope.$apply(); 但我收到一个警告,它已经在运行。

更新++

我最终使用的解决方案是在 ng-init 上添加一个函数来首先检查该数组是否存在,如果它不存在,则创建它,然后将其分配给新变量。

这是一个更深入的例子,
写这个 jsFiddle 已经指出问题出在 ng-include/ng-repeat - 没有这个很好。 http://jsfiddle.net/20mobk2h/56/
http://jsfiddle.net/20mobk2h/61/

ng-repeat 在称为选项的数组上循环,该数组可能存在也可能不存在。

<div ng-init="options = element.options">
    <div ng-repeat="option in options" ng-include="'optionsTree'"></div>
</div>

我通过以下方式添加了一个新选项:

$scope.addItem = function(item) {

    if(!item.options){
        item.options = [];
    }

    var obj = {
        val: 'blah'
    };

    item.options.push(obj);
}
4

3 回答 3

1

更改此代码:

<div ng-init="options = item.options">
    <div ng-repeat="option in options" ng-include="'nest_options'"></div>
</div>

对此:

<div>
    <div ng-repeat="option in item.options" ng-include="'nest_options'"></div>
</div>

这里的问题是,当您分配item.options给新变量时options,您会中断与item对象的引用,因为第一次(何时item.optionsundefined选项是undefined并且原始值是在 Javascript 中按值传递的。因此,稍后当您更改options属性(通过添加新的数组元素)时,此更改不会反映在options变量中。

但是,当您第二次打开 popup 时,item.options不再是undefined,它已经是一个对象(数组),因此赋值options = item.options会导致正常的对象引用,并且更改item.options会镜像到item.

演示:http: //jsfiddle.net/20mobk2h/57/

于 2014-10-07T12:46:52.000 回答
1

$scope.$apply()应该真的是解决你的问题。

尝试使用此包装器$scope.$apply()

$scope.safeApply = function(fn) {
  var phase = this.$root.$$phase;
  if(phase == '$apply' || phase == '$digest') {
    if(fn && (typeof(fn) === 'function')) {
      fn();
    }
  } else {
    this.$apply(fn);
  }
};

然后只需在需要的地方将 $apply 替换为 safeApply

$scope.safeApply(function() {
  alert('Now I'm wrapped for protection!');
});

可能将它传递给您需要运行的功能。使用它,您应该能够尊重应用 - 摘要循环并apply仅在允许时运行。

取自这里

于 2014-10-07T10:23:39.630 回答
0

你能写出你的控制器和页面的完整代码吗?您是否在 yr page 和 routeProvider 中都指定了 ng-controller ?如果在 routeProvider 中指定,则从页面中删除 ng-controller。

于 2014-10-07T11:10:59.940 回答