如何从角模板中通过他的ID获取DOM元素？

我需要通过他的ID获取元素，但是此元素是从另一个html文件加载的。如何从角模板中通过他的ID获取DOM元素？

这是我的index.html：

<div class="container" ng-controller="myCtrl"> 
    <div class="row"> 
     <div class="col-md-4"> 
      <div ng-include="foo.template"></div> 
     </div> 
    </div> 
</div>

而且在myCtrl.js：

app.controller('mainCtrl', ['$scope', function ($scope) { 
    $scope.foo = { 
     title: 'Title', 
     template: 'views/myTemplate.html' 
    }; 
    console.log(document.getElementById('test')) // Display null 
}]);

而且myTemplate.html：

<div id="test">Check</div> 
<script> 
    console.log(document.getElementById('test')) // Never execute 
</script>

我如何获得DOM ID为'test'的元素？

仅供参考，我需要得到它的JS LIB添加自定义滚动条。

来源

2015-07-10 Alex

http://stackoverflow.com/questions/31301475/call-angularjs-from-other-scripts/31301533#31301533 – Vineet

您可以使用angular.element：

裹原始DOM元素或HTML字符串作为一个jQuery元素。

如果jQuery是可用的，angular.element是jQuery函数的别名。如果jQuery不可用，angular.element将委托给Angular的jQuery内置子集，名为“jQuery lite”或“jqLite”。

angular.element(document.getElementById('test'));

angular.element(document.querySelector('#test'))

编辑

您需要使用$timeout：角的包装为window.setTimeout。 fn函数被封装到try/catch块中，并将任何异常委托给$ exceptionHandler服务。

app.controller('mainCtrl', ['$scope', '$timeout', function($scope, $timeout) { 
    $scope.foo = { 
     title: 'Title', 
     template: 'views/myTemplate.html' 
    }; 

    $timeout(function() { 
     console.log(document.getElementById('test')); 
    }, 0); 

    // setTimeout(function() { 
    //  console.log(document.getElementById('test')); 
    // }, 0); 
}]);

来源

2015-07-10 13:05:23 Tushar

这是一个例子，解释了如何通过ID在Angular.js中获取元素。 http://mlen.io/angular-js/get-element-by-id.html –

@ShaohaoLin请参阅'Edit' – Tushar

你能解释一下为什么我们需要一个控制器中的setTimeout函数？ –

您还可以使用jQuery来获取元素并对其进行处理。

$("#test").html(); will display "Check" in your case.

来源

2015-07-10 13:07:31

否'jQuery'被标记为 – Tushar

打开此链接以查看实时预览http://plnkr.co/edit/CBXThWRHdnHwa5RZXD0C?p=preview –

什么我在说的是'jQuery'没有被标记为问题，甚至没有提到问题 – Tushar

随着angularjs，处理jQuery来操纵元素是坏尤其是在控制器（这是错误的方式），它应该在的指令进行管理。

但是对于你的问题，你试图在没有加载的时候获取元素（异步调用），所以你应该为这个元素编写一个指令，并且在链接函数中做任何你想做的事情，导致元素将会加载。

来源

2015-07-10 13:15:33 Stainz

如何从角模板中通过他的ID获取DOM元素？

回答

相关问题