When i use <nz-tabset> and <nz-tab>，create two tabs, as tab1 and tab2,when i open the page, tab1 and tab2 all print the console information

[julin69]

Version

1.8.1

Environment

local

Reproduction link

https://ng-zorro-antd-start-bqptxw.stackblitz.io

Steps to reproduce

When i use and ，create two tabs, as tab1 and tab2,when i open the page, tab1 and tab2 all print the console information

What is expected?

when i open tab1,render tab1 content, and when i open tab2,render tab2 content

What is actually happening?

when i open tab1,tab1 and tab2 all print the console information

Other?

[julin69]

The screenshoot is below:

[guobin211]

you need route

routes = [
{path: "tab1", component: Tab1Component},
{path: "tab2", component: Tab2Component}
]

html

<nz-tabset>
  <nz-tab nzTitle="tab1" (nzClick)=navTo("tab1")></nz-tab>
  <nz-tab nzTitle="tab2" (nzClick)=navTo("tab2")></nz-tab>
</nz-tabset>
<route-outlet></route-outlet>

ts

navTo(p) {
  this.route.navigate(p);
}

[wzhudev]

Known problem. Anything contains in <ng-content> would be created even if its DOM wouldn't be rendered, actually it's a feature (or bug?) of Angular. We would introduce another method to solve this problem in the future. For now you could use @guobin211 's method.

Actually, the method is used in material2 now.