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角色的操作

回答

相關問題