Угловой 6: дисплей выпадающий, кроме вкладки мат

Я пытаюсь отобразить раскрывающийся список помимо одной из вкладок, и пользователь должен иметь возможность щелкнуть параметры раскрывающегося списка. Может кто-нибудь, пожалуйста, помогите и дайте идею, как мне этого добиться. Я пытался загрузить stackBlitz, как-то не смог этого сделать. Я предоставлю любую информацию, что требуется. Спасибо!!

<mat-tab-group>
<mat-tab
    label="PROFILE">
    <mat-select placeholder="PROFILE">
        <mat-option>address</mat-option>

    </mat-select>

    <mat-tab-body>
        <p> Name : ABC</p>
        <p>Age: 123</p>
    </mat-tab-body>
</mat-tab>

<mat-tab
    label="Dashboard">
    <mat-select placeholder="DB">
        <mat-option>1</mat-option>

    </mat-select>

    <mat-tab-body>
        <p> Name : Test</p>
        <p>Age: 123</p>
    </mat-tab-body>
</mat-tab>

1 ответ

Ты можешь использовать <nav mat-tab-nav-bar> для достижения этой цели. См.: Угловые вкладки и Навигация

nav mat-tab-nav-bar аналогичен mat-tab, единственное отличие состоит в том, что вы можете размещать пользовательский HTML-код в заголовках вкладок, определять события на щелчках вкладок и на основе этих событий и вашей логики вы можете создавать тело вкладок либо через розетку маршрутизатора, либо показывая и скрывая компоненты под вашим nav mat-tab-nav-bar.

Я создал Stackblitz для вас. Вкладки с Select Hope это помогает.

Другие вопросы по тегам