小编bik*_*guy的帖子

如何从Angular2和ng-bootstrap中的组件中的NgbTabSet访问'select'方法?

使用Angular 2.3.1和ng-bootstrap 1.0.0-alpha.18.我试图以编程方式从组件中选择基于ID的选项卡,而不是从模板中选择.目标是从URL中提取param并使用它来选择ngOnInit中的选项卡

模板

<section id="policy-terms">
<ngb-tabset>
  <ngb-tab title="Terms and Privacy" id="terms">
    <template ngbTabContent>
      <div class="container page-content">

      </div>
    </template>
  </ngb-tab>
  <ngb-tab title="Company Policy" id="policy">
    <template ngbTabContent>
      <div class="container page-content">

      </div>
    </template>
  </ngb-tab>

</ngb-tabset>
</section>
Run Code Online (Sandbox Code Playgroud)

和组件代码:

import { Component, OnInit } from '@angular/core';
import { NgbTabset } from '@ng-bootstrap/ng-bootstrap';

@Component({
  selector: 'app-policy-terms',
  templateUrl: './policy-terms.component.html',
  styleUrls: ['./policy-terms.component.scss'],
  providers: [
       NgbTabset
   ]
 })
 export class PolicyTermsComponent implements OnInit {

 constructor(
    public tabset: NgbTabset
  ) { }

  ngOnInit() {
    this.tabset.select('policy');
   }
}
Run Code Online (Sandbox Code Playgroud)

这只会产生一个错误:

控制台日志错误 …

tabs ng-bootstrap angular

14
推荐指数
2
解决办法
2万
查看次数

标签 统计

angular ×1

ng-bootstrap ×1

tabs ×1