Директива AngularJS 1.5.5: $element.find() / $element.children() не всегда работает

Это пример директивы, которую я создал, чтобы помочь понять проблему, описанную в заголовке:

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 результатов.

Есть ли известная причина проблемы, с которой я сталкиваюсь? Есть ли надежное решение для передачи ссылки на подэлемент, определенный в шаблоне, в область видимости?


person Tarps    schedule 13.10.2017    source источник


Ответы (1)


Причиной было состояние гонки между загрузкой jqLite и jQuery. Если jQuery загружался достаточно быстро, вместо jqLite использовался jQuery, и оператор работал. Только с jqLite оператор не удался.

Решение для RequireJS состояло в том, чтобы добавить jQuery в качестве зависимости Angular в файл записи.

person Tarps    schedule 24.10.2017