Question

这个问题正在建立this question。基本上，我有一个指令，它创建一个ng-repeat，迭代一个动态变化的集合。（我的意思是动态更改是JSON数据经常使用新集合更新）。

这些ng-repeats中的函数没有被调用，即我在控制台上看不到它们。 ng-repeats的项目显示在视图中。但是，当我使用常规ng-repeat并迭代特定集合时，操作可以正常工作。我猜测指令（dyn-ng-repeat）有一些问题涉及ng-repeat，但我无法弄明白。

这是JSON的一个例子。 model1和model2是不同的集合，稍后将使用类似的结构创建更多集合（例如model3和model4）。在一个视图中，我只想展示一个模型，而不是所有模型。

{
    {
        "model": "model1",
        "children": [
         {
            "action": "removeChild",
            "model": "item",
            "text" : "remove this child"
         }
        ]
     },
     {
        "model": "model2",
        "children": [
         {
            "action": "removeChild",
            "model": "item",
            "text" : "remove this child"
         }
        ]
     }
 }

这是HTML：

<div ng-repeat="field in fields">    
 <div dyn-ng-repeat="item in {{field.model}}">
  <div ng-repeat="field in field.children">
   <div dyn-click click-action="{{field.action}}" click-model=" {{field.model}}">{{field.text}}</div>
  </div>
 </div>
</div>

正如我之前提到的，当我将HTML代码的第一行更改为<div ng-repeat="item in model1">时，ng-repeat子句中的函数被调用并执行正常。使用dyn-ng-repeat，项目会显示出来，它们只是没有执行它们的功能。

这里是dyn-ng-repeat指令的代码：

'use strict';

exports = module.exports = function (ngModule) {
    ngModule.directive('dynNgRepeat', function($compile){
        return{
         scope:true,
         link:function(scope,element,attr){
            element[0].removeAttribute('dyn-ng-repeat');
            element[0].setAttribute('ng-repeat', attr.dynNgRepeat + ' track by $index');
            $compile(element[0])(scope);
        }
    };
 });
};

这里是dyn-click指令的代码：

'use strict';

exports = module.exports = function (ngModule) {
  ngModule.directive("dynClick",function($compile) {
    return {
      restrict: 'A',
      scope:true,
      link: function(scope,element,attrs) {
         $(element).click(function(e, rowid){
               scope.$eval(attrs["clickAction"]) (scope.$parent.$eval(attrs["clickModel"]), scope.$index);
            });
        }
    };
  });
};

函数removeChild是从父控制器执行的，用于删除该子节点：

exports = module.exports = function (ngModule) {
  ngModule.controller('HomeCtrl', function ($scope, $timeout, $http, $state,      $stateParams, limitToFilter, Restangular, $rootScope, $translate) {

  $scope.removeChild = function(model, index){
      $rootScope.field.model.splice(index, 1);
      $scope.$digest();
  };

};

有关为什么removeChild函数没有使用dyn-ng-repeat指令执行的任何想法？

我还针对此问题创建了一个Plunker：http://plnkr.co/edit/fFyMPlIK1LJMM4cfU0ld?p=preview。但是，在Plunker中，函数被调用但存在问题。我真的不知道为什么要在Plunker中调用该函数，而不是在我的应用程序中。我已经在这里待了几天，而在这一点上，一个全新的视角可能会有所帮助。

提前感谢您的帮助。

AngularJS：在动态创建的ng-repeat中不执行的函数

0 个答案: