Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/arrays/13.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript AngularJS嵌套ng重复访问$parent数组元素_Javascript_Arrays_Angularjs - Fatal编程技术网

Javascript AngularJS嵌套ng重复访问$parent数组元素

Javascript AngularJS嵌套ng重复访问$parent数组元素,javascript,arrays,angularjs,Javascript,Arrays,Angularjs,对,所以我有一个进退两难的问题,这似乎是一个简单的问题,但我无法理解 我有一个嵌套数组: $scope.rootItem = { id: '1', type: 'course', title: 'Adobe Photoshop CC for beginners', items: [{ id: '2', type: 'label', title:'Label Ti

对,所以我有一个进退两难的问题,这似乎是一个简单的问题,但我无法理解

我有一个嵌套数组:

$scope.rootItem = {
        id: '1',
        type: 'course',
        title: 'Adobe Photoshop CC for beginners',
        items: [{
            id: '2',
            type: 'label',
            title:'Label Title',
            items:[{
                id: '3',
                type: 'module',
                title:'Module title',
                items: [{
                    id: '4',
                    type: 'topic',
                    title:'Topic title',
                    items: [{
                        id: '5',
                        type: 'content',
                        title:'Content title'
                    }, {
                        id: '6',
                        type: 'content',
                        title:'Content title'
                    }]
                }]
            },{
                id: '7',
                type: 'resources',
                title:'Resources'
            },{
                id: '8',
                type: 'module',
                title:'Module title',
                items: [{
                    id: '9',
                    type: 'topic',
                    title:'Topic',
                    items: [{
                        id: '10',
                        type: 'question',
                        title:'Question title'
                    }]
                }, {
                    id: '11',
                    type: 'topic',
                    title:'Topic title',
                    items: [{
                        id: '12',
                        type: 'content',
                        title:'Content title'
                    }]
                }]
            }]
        },{
            id: '14',
            type: 'assessmentLabel',
            title: 'Assessment Label',
            items: [{
                id: '15',
                type: 'assessment',
                title: 'Assessment Title',
                items: [{
                    id: '16',
                    type: 'courseAssessment',
                    title: 'Course Assessment Question',
                    items: []
                }]
            }]
        }]
    };
使用ng repeat输出的。所有这些都非常好,顺便说一句,它也可以使用ng sortable(基于JQuery UI sortable)进行排序

我试图做的是使用
angular.copy()
复制id:5

HTML:

对我来说,传递父项ngModelItem.items(items是ID:5所属的数组)是有意义的。但是我不明白为什么$parent.ngModelItem.items是未定义的

这是我的控制器:

$scope.duplicate = function(item, parent) {
        var itemCopy = angular.copy(item);

        parent.push(item);
    };
HTML ng重复:

<ul class="apps-container" ui-sortable="sortableOptions" ng-model="ngModelItem.items" ng-class="ngModelItem.type">
            <li class="innerCont" ng-repeat="innerItem in ngModelItem.items">
                <tg-dynamic-directive ng-model="innerItem" tg-dynamic-directive-view="getView">
                </tg-dynamic-directive>
            </li>
        </ul>
它不起作用

以下指示:

angular.module('tg.dynamicDirective', [])
    .directive('tgDynamicDirective', ['$compile',
        function($compile) {
            'use strict';

            function templateUrlProvider(getView, ngModelItem) {
                if (getView) {
                    if (typeof getView === 'function') {
                        var templateUrl = getView(ngModelItem) || '';
                        if (templateUrl) {
                            return templateUrl;
                        }
                    } else if (typeof getView === 'string' && getView.length) {
                        return getView;
                    }
                }
                return '';
            }

            return {
                restrict: 'E',
                require: '^ngModel',
                scope: true,
                template: '<div ng-include="templateUrl"></div>',
                link: function(scope, element, attrs, ngModel) {

                    scope.$watch(function() {
                        var ngModelItem = scope.$eval(attrs.ngModel);
                        var getView = scope.$eval(attrs.tgDynamicDirectiveView);
                        scope.ngModelItem = ngModelItem;
                        return templateUrlProvider(getView, ngModelItem);
                    }, function(newValue, oldValue) {
                        scope.templateUrl = newValue;
                    });
                }
            };
        }
    ]);
角度模块('tg.dynamicDirective',[]) .directive('tgDynamicDirective',['$compile', 函数($compile){ "严格使用",; 函数templateUrlProvider(getView,ngModelItem){ 如果(getView){ if(getView的类型=='function'){ var templateUrl=getView(ngModelItem)| |“”; if(模板URL){ 返回模板URL; } }else if(typeof getView=='string'&&getView.length){ 返回getView; } } 返回“”; } 返回{ 限制:'E', 要求:“^ngModel”, 范围:正确, 模板:“”, 链接:功能(范围、元素、属性、模型){ 范围$watch(函数(){ var ngModelItem=范围$eval(属性ngModel); var getView=scope.$eval(attrs.tgdynamicdirectiview); scope.ngModelItem=ngModelItem; 返回templateUrlProvider(getView,ngModelItem); },函数(新值,旧值){ scope.templateUrl=newValue; }); } }; } ]);
经过几个小时的修复,并阅读了大量关于继承的文章,我发现ng如果使用原型继承创建新的作用域。我没有解释

这要求我在将$parent传递给函数时再插入一个$parent:

data-ng-click="duplicate(ngModelItem, $parent.ngModelItem.items)"
 data-ng-click="duplicate(ngModelItem, $parent.$parent.$parent.ngModelItem)"
然后在控制器中执行如下操作:

$scope.duplicate = function(item, parent) {
        var itemCopy = angular.copy(item);
        var parentArray = parent.items;
        parentArray.push(itemCopy)
    };

希望这能为遇到这个问题的人节省工作时间。

你能制作一把小提琴来展示你的问题吗?嘿,戈皮纳,用小提琴来重现是非常复杂的(我问fiddle是因为我看不到你的“ng repeat”代码在上面的问题中。你能粘贴所有必要的代码来反映你的问题吗?OK,当然没有问题,1秒钟提到你的指令代码,指令作用域可能有问题。我有$parent。$parent和一些必须更新的内容。添加第三个$parent就成功了。
 data-ng-click="duplicate(ngModelItem, $parent.$parent.$parent.ngModelItem)"
$scope.duplicate = function(item, parent) {
        var itemCopy = angular.copy(item);
        var parentArray = parent.items;
        parentArray.push(itemCopy)
    };