在angular2中获取节点的方法

在应用层直接操作 DOM，就会造成应用层与渲染层之间强耦合，导致我们的应用无法运行在不同环境，如 web worker 中，因为在 web worker 环境中，是不能直接操作 DOM。

通过 ElementRef 我们就可以封装不同平台下视图层中的 native 元素 (在浏览器环境中，native 元素通常是指 DOM 元素)，最后借助于 Angular 提供的强大的依赖注入特性，我们就可以轻松地访问到 native 元素。

angular2有生命周期钩子AfterViewInit可以帮助我们在view加载完之后再执行相应的ts

ts:

下面有一种优化方案，运用angular内置属性装饰器@ViewChild

ts:

html:

<p #greet>hello world</p>  //element的标识"#name",@ViewChild根据这个搜索元素

angular中怎么获取dom元素

步骤分解：

第一步：给要获取的元素一个ng-model变量，并且绑定事件啦！

代码如下:

<p class="home" ng-model="dirName" ng-mouseenter="switchImage($event,dirName)"></p> //给要获取的元素一个ng-model变量

第二步：在controller中利用$event.target获取dom元素即可！

相关推荐：

JS获取节点的兄弟,父级,子级元素的方法_javascript技巧

jQuery获取节点和子节点文本的方法_jquery

jquery获取节点名称_jquery

以上就是在angular2中获取节点的方法的详细内容，更多请关注Gxl网其它相关文章！