Question

我试图以不同的方式从我的模板中获取一个元素，但它们似乎都不起作用。这是我的代码：

<div ng-controller="mainCtrl">       
  <div id="main-content">
     <h1>Main Content</h1>
  </div>
</div>

angular.module("mainModule", [])
    .controller("mainCtrl", ["$scope", "$document", function ($scope, $document) {
      $scope.init = function() {
        var element = angular.element("#main-content");
        console.log(element);
        element = angular.element("main-content");
        console.log(element);
        element = $document.find("#main-content");
        console.log(element);
      }();
    }]);

也许你们其中一个有任何想法？谢谢你的帮助！

Answer 1

使用angular时，尽量避免使用DOM操作。但如果您仍想这样做：下面是获取所需元素的方法：

       angular.element(document.querySelector('#main-content'))

你也可以使用$ element service

        $element.find('#main-content')

Answer 2

您应该为此创建Directive。 AngularJS controller should NEVER reference DOM elements

试图从模板中获取元素

2 个答案: