angularjs指令不会进入

时间:2013-12-03 09:14:08

标签: angularjs angularjs-directive angularjs-ng-repeat

好的,我的指令存在问题,该指令位于ng-repeat上,但也没有运行。

所以这就是来了

主要模板:

 <div ng-if="[%!query.$resolved%]">
    <div ng-cloak ng-show="query.mission_type == 0" class="animate-show">
        <div ng-include src="'Interctive/templates/missions/plugins/open_question_plugin.html'"></div>
    </div>

    <div ng-cloak ng-show="query.mission_type == 1"  class="animate-show">
        [%query.type_plugin%]33
         <div ng-include src="'Interctive/templates/missions/plugins/american_question_plugin.html'"></div>
    </div>
</div>

第二个模板:

<div>
    <div mission_item dataitem="query.forms[0]" >[%query.forms%]</div>
    <div ng-repeat="item in query.forms" >
        <div mission_item dataitem="item" ng-model="item">[%item%]--</div>
    </div>
</div>

指令加载:

define([
    // Standard Libs
    'jquery'     // lib/jquery/jquery
    , 'Angular'    // lib/angular/angular
    , 'directives/missions/mission_item_handler'
    // Application Widgets

], function ($, angular,mission_item_handler_directive) {
    "use strict";
    Console.group("Entering Widgets module.");

    var directives = {
        "mission_item":mission_item_handler_directive
    };
    Console.info("Registered directives: ", directives);

    var initialize = function (angModule) {
        _.each(directives, function (filter, name) {
            angModule.directive(name, filter[1]);
        })
        Console.debug("Custom widgets initialized.");
    }

    Console.groupEnd();
    return {
        initialize: initialize
    };
});

指令代码:

define([
    // Standard Libs
    'jquery',
    'text!templates/missions/plugins/open/field_text.html',
    'text!templates/missions/plugins/open/field_image.html',
    'text!templates/missions/plugins/open/field_youtube.html',
    'text!templates/missions/plugins/open/field_textbox.html'
], function ($, field_text_template, field_image_template, field_youtube_template, field_textbox_template) {
    "use strict";
    Console.group("Entering Directive Open Question Items Field.");
    var directive = ['mission_item', function ($compile) {
        return {
            restrict: 'A',
            replace: false,
            order: 9999,
            scope: { dataitem: "="},
            link: function (scope, element, attrs) {
                Console.log("Entered Field Item" , scope);
                var templateFn;

                attrs.$observe('item', function (newValue) {
                    console.log(newValue)
                })
                /*if (item.type == "header")
                    templateFn = $compile(field_text_template);
                if (item.type == "image")
                    templateFn = $compile(field_image_template);
                if (item.type == "textbox")
                    templateFn = $compile(field_textbox_template);
                templateFn(scope);*/
            }
        };
    }];
    Console.groupEnd();
    return directive;
});

现在我的主要问题是,即使我在指令中执行断点,但是它已加载但未运行意味着我看到系统的输出已被加载但是当我放入ng-reapeat(或没有)其停止时工作,不知道为什么

任何指针?

2 个答案:

答案 0 :(得分:0)

注意到您设置order这是设置priority的旧方法吗?(大多数指令声明对我来说有点奇怪,所以也许我错过了什么)

如果命令确实是优先级,则可能应将其设置为低于ng-repeat优先级1000,因此它将在ng-repeat之后编译并且可以item可用。只是一个预感

答案 1 :(得分:0)

好的,我发现指令和ng-repeat基本上不能很好地协同工作后我重新设计了系统,并添加了传递给对象的指令,并在ai之后添加了指令中的模板(杀死其中一个模板yaya! )。 之后我将指令定义更改为:

        restrict: 'E',
        priority: 0, //must be 0 or transclusion fails
        replace: true, //must be true
        transclusion:true,

之后所有工作ng-repeat和指令然后你做错了只是使用指令更聪明,更少开销:) 这就是我发现的