Question

我的Javascript（Angular自定义指令）如下：

var addedSubject = function($rootScope){
   return{
      restrict:'E',
      templateUrl:'/static/html/marks_app/directives/added_subject_item.html',
      replace:true,
      scope:{
      },
      controller:["$scope", function($scope){
          $scope.mySubjects = $rootScope.allSubjects;
      console.log($scope.mySubjects);
  }]
  };
 };
 marksApp.directive('addedSubjectDirective', ["$rootScope",addedSubject]);

我的HTML如下：

 <div class="modal-body">
                <div class="form_body sub_results">
                    <div id="search_module_head" class="form_panels">
                        <div id="search_univ" >
                            <select id="form_sub_sel" autofocus form="form_sub_eval">
                                <option disabled selected>Select University</option>
                                <option value="ufs">University of the Free State</option>
                            </select>
                        </div>
                        <div id="search_code" class="form_panels">
                            <input type"text" id="search_code_input" ng-model="subFilter" placeholder="Enter Subject Code"></input>
                        </div>
                    </div>
                    <div class="search_results">
                        <div class="search_results_head">
                            <p>Search Results</p>
                        </div>
                        <div id="search_results_content">
                            <ul>
                              <search-result-list-item
                                ng-repeat="varsitySub in allUnivSubjects | searchFor:subFilter"
                                varsity-subject="varsitySub">
                              </search-result-list-item>
                            </ul>
                        </div>
                    </div>
                </div>
                <div id="added_sub_list">
                    <div class="added_sub_list_head">
                      <p>
                        Added Subjects
                      </p>
                    </div>
                    <div class="added_sub_list_body">
                      <ul>
                          <added-subject-directive ng-repeat="addedSub in mySubjects">
                          </added-subject-directive>
                     </ul>
                  </div>
             </div>
 </div>

问题是当我在指令的HTML上运行带有ng-repeat的代码（added-subject-directive）时，代码拒绝工作。它没有在屏幕上显示任何内容，也没有记录我尝试从指令的Javascript中记录的任何内容。但是，当我删除ng-repeat时，代码按预期执行（没有 ALL 所需的输出，但由于没有ng-repeat）。我把所有的头发拉了出来，所以任何人都可以帮助我尝试理解在这种情况下我可能做错了什么？

Answer 1

一些事情。 ngRepeat是终端指令。使用终端指令，当前优先级将是将执行的最后一组指令（当前优先级的任何指令仍将执行，因为未定义相同优先级的执行顺序）。请注意，指令模板中使用的表达式和其他指令也将被排除在执行之外。

ngRepeat的优先级也为1000.当在单个DOM元素上定义了多个指令时，有时需要指定应用指令的顺序。优先级用于在调用编译函数之前对指令进行排序。优先级定义为数字。首先编译具有更高数字优先级的指令。预链接功能也按优先级顺序运行，但后链接功能以相反的顺序运行。具有相同优先级的指令的顺序是undefined。默认优先级为0。

为您的指令添加更高的优先级，以确保它先运行。

var addedSubject = function($rootScope){
   return{
      restrict:'E',
      templateUrl:'/static/html/marks_app/directives/added_subject_item.html',
      replace:true,
      priority: 1001, // added higher priority than ngRepeat
      scope:{
      },
      controller:["$scope", function($scope){
          $scope.mySubjects = $rootScope.allSubjects;
      console.log($scope.mySubjects);
  }]
  };
 };
 marksApp.directive('addedSubjectDirective', ["$rootScope",addedSubject]);

ng-repeat拒绝执行

1 个答案: