使用Angular Bootstrap切换选项卡并使用data-toggle传递数据的解决方法如下:
npm install @ng-bootstrap/ng-bootstrap
import { Component } from '@angular/core';
import { NgbTabChangeEvent } from '@ng-bootstrap/ng-bootstrap';
export class MyComponent {
activeTab: string = 'tab1';
}
Tab 1
Content for Tab 1
Tab 2
Content for Tab 2
onTabChange(event: NgbTabChangeEvent) {
if (event.nextId === 'tab1') {
// 数据处理逻辑 for Tab 1
} else if (event.nextId === 'tab2') {
// 数据处理逻辑 for Tab 2
}
}
这样,你就可以使用Angular Bootstrap切换选项卡并使用data-toggle传递数据了。当选项卡切换时,onTabChange方法会被调用,并传递一个NgbTabChangeEvent对象,你可以通过该对象的nextId属性获取当前选中的选项卡的id。根据需要,在onTabChange方法中根据选项卡的id处理数据。