如何使用清晰度设计在选项卡内创建选项卡

Question

以前我使用TabLink清晰角度的组件来创建选项卡。现在，升级到@clr/angular我后无法使用，TabLink因此无法在选项卡内创建选项卡。我该如何进行？

Answer 1

这应该可以工作，我只是在Simple Tabs示例的文档中复制了我们的示例代码，并将其嵌套在选项卡 2 中。有关功能代码，请参阅此stackblitz。

        <clr-tabs>
          <clr-tab>
              <button clrTabLink id="link1">Tab1</button>
              <clr-tab-content id="content1" *clrIfActive>
              tab 1
              </clr-tab-content>
          </clr-tab>
          <clr-tab>
              <button clrTabLink>Tab2</button>
              <clr-tab-content *clrIfActive="true">
              tab2
                <clr-tabs>
                  <clr-tab>
                      <button clrTabLink id="link1">Tab1</button>
                      <clr-tab-content id="content1" *clrIfActive>
                      tab 2.1
                      </clr-tab-content>
                  </clr-tab>
                  <clr-tab>
                      <button clrTabLink>Tab2</button>
                      <clr-tab-content *clrIfActive="true">
                      tab 2.2
                      </clr-tab-content>
                  </clr-tab>
              </clr-tabs>
              </clr-tab-content>
          </clr-tab>
      </clr-tabs>