Dom角色的操作

如何在Angular中处理DOM操作。我不想使用jQuery。Dom角色的操作

以下是我的jQuery代码：

$(".next-step").click(function (e) { 
    var $active = $('.wizard .nav-tabs li.active'); 
    $active.next().removeClass('disabled'); 
    nextTab($active); 

}); 

function nextTab(elem) { 
    $(elem).next().find('a[data-toggle="tab"]').click(); 
}

基本上我有面包屑我想去的下一张标签。

来源

2017-08-08 Ankit Raonka

如果您正在寻找Angular 1.x的答案，请将标记从'angular'更改为'angularjs'。由于“角”标签严格适用于Angular 2/4。 –

使用Angular 2+，通常情况下，您不应该操作DOM，这是渲染器的工作。请张贴您的组件代码并详细说明您的问题，目前尚不清楚。 – n00dl3

我想这篇文章会对你有所帮助： https://hackernoon.com/top-common-mistakes-of-angular-developers-2a36524f2c21 你应该阅读“直接改变dom”章节 –

Renderer2用于DOM操作在角4.

@ViewChildren('list') list:QueryList<ElementRef>; 

    next(){ 
     var index = this.list.toArray().findIndex(i => i.nativeElement.classList.contains('active')); 
     var sibling = this.list.toArray()[index+1].nativeElement; 
     this.renderer.removeClass(sibling,'disabled'); 
     this.nextTab(sibling); 
    } 

    nextTab(elem) { 
     var elemChildren = elem.children; 
     elemChildren[1].click(); 

}

以上是如何转换的上面的代码。

使用ViewChildren并用#list标记了我的li。（一些参考）

来源

2017-08-09 04:44:54

Dom角色的操作

回答

相关问题