vmware-clarity - 如何使用清晰设计在选项卡内创建选项卡

Question

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

Answer 1

这应该可行，我只是在简单选项卡示例的文档中复制了我们的示例代码，并将其嵌套在选项卡 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>