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が十分に高速にロードされた場合は、jqLit​​eの代わりにjQueryが使用され、ステートメントが機能しました。 jqLit​​eだけでは、ステートメントは失敗しました。

解決策は、RequireJSの場合、エントリファイルにAngularの依存関係を追加することでした。