javascript - element.find ('li' ) 不匹配任何结果

Question

我有一个 angularJS 指令，它在 toState 匹配 ui-sref 值时更改 li 样式属性。

出于某种原因，element.find('li') 给我带来了一个空结果。下面我粘贴我的代码:

navbar.js

navbar.directive('appNavbar', [ function () {
  return {
    restrict: 'E',
    link: function ($state, element) {
      $state.$on("$stateChangeSuccess", function (event, toState) {
        console.log(element.find('li')); // here is comming an empty value
        angular.forEach(element.find('li'), function (a, i) {
          // li css change stuff
        });
      });
    }
  };
}]);

_navbar.html

<app-navbar ui-view="navbar">
  <div class="nb-main">
    <ul id="list-nav" class="list-navbar">
      <li ng-include="'svg/navbar-home.svg'" ui-sref="base.home"></li>
      <li ng-include="'svg/navbar-discover.svg'" ui-sref="base.discover"></li>
      <li ng-include="'svg/navbar-discover.svg'" ui-sref="base.discover"></li>
    </ul>
    <div class="nb-img line-navbar"></div>
  </div>
</app-navbar>

我做错了什么？

Answer 1

来自 the documentation :

Note: Keep in mind that this function will not find elements by tag name / CSS selector. For lookups by tag name, try instead angular.element(document).find(...) or $document.find(), or use the standard DOM APIs, e.g. document.querySelectorAll().