问题描述: 在Angular 7中,使用select方法在动态创建的ngb-tabs上时,无法起作用。
解决方法: 这个问题通常是由于动态创建的ngb-tabs还没有被初始化导致的。解决方法是确保在调用select方法之前,动态创建的ngb-tabs已经被完全初始化。
以下是一个示例解决方法:
Content of Tab 1
Content of Tab 2
import { Component, OnInit } from '@angular/core';
import { NgbTabset } from '@ng-bootstrap/ng-bootstrap';
@Component({
selector: 'app-tabs',
templateUrl: './tabs.component.html',
styleUrls: ['./tabs.component.css']
})
export class TabsComponent implements OnInit {
isTabsCreated = false;
constructor() { }
ngOnInit() {
// 在初始化方法中创建和初始化ngb-tabs
this.createTabs();
}
createTabs() {
// 创建和初始化ngb-tabs的代码
// ...
// 设置isTabsCreated为true,以显示ngb-tabs
this.isTabsCreated = true;
// 在需要的地方调用select方法
// 注意:确保在ngb-tabs被完全初始化后调用select方法
this.selectTab();
}
selectTab() {
// 通过ViewChild获取ngb-tabset实例
@ViewChild(NgbTabset) tabset: NgbTabset;
// 在需要的地方调用select方法
this.tabset.select('tabId'); // 替换为实际的tabId
}
}
通过以上解决方法,你可以在Angular 7中使用select方法在动态创建的ngb-tabs上实现所需的功能。
下一篇:Angular 7中的SVG清理