AngularJS 1.5.5指令：$ element.find（）/ $ element.children（）並不總是工作

Question

這是我爲了幫助理解標題描述的問題的樣本指令：

define(['angular'], function(angular) { 
    'use strict'; 

    var randomElement = angular.module('RandomElement', []); 

    randomElement.directive('randomElement', function() { return { 
    restrict: 'E', 
    transclude: false, 
    template: '<div><span class="random-span"></span></div>', 
    controller: function($scope, $element) { 

     // This method is triggered in a ng-click binding 
     $scope.findSpan = function() { 
     // About 20-30% of page reloads, this returns 0 results 
     console.log($element.find('.random-span')); 
     } 

    } 
    }}); 

    return randomElement; 
}); 

請注意$scope.findSpan方法。這是我遇到的問題：約20-30％的頁面重新加載，$element.find()（或$element.children()就此而言）返回0結果。

是否有我遇到的問題的已知原因？將模板中定義的子元素的引用傳遞給作用域是否有固定的解決方案？

Answer 1

原因是加載jqLite和jQuery之間的競爭條件。如果jQuery加載速度夠快，則使用jQuery而不是jqLit​​e，並且該語句有效。只有jqLit​​e，聲明失敗。

RequireJS的解決方案是在條目文件中添加jQuery作爲Angular依賴項。