Question

我想使用4号角将布局分隔到不同的组件上。

通过我使用https://edcarroll.github.io/ng2-semantic-ui/#/modules/sidebar

的方式

我分为三个部分：

用于顶部导航的顶部栏
侧边导航栏
基础布局的基础

topbar：

<div class="ui top yellow fixed inverted menu">
  <a class="item" (click)="sidebar.toggle()">
    <i class="sidebar icon"></i>
  </a>
  <div class="item">
    My Website
  </div>
  <a class="item" routerLink="/">Home</a>
  <a class="item" routerLink="/news">News</a>
  <div class="right menu">
    <div class="ui category search item">
      <div class="ui transparent icon input">
        <input class="prompt" type="text" placeholder="Search User...">
        <i class="search link icon"></i>
      </div>
      <div class="results"></div>
    </div>
    <div class="ui dropdown item" suiDropdown>
      Yoza Wiratama <i class="icon dropdown"></i>
      <div class="menu" suiDropdownMenu>
        <a class="item">Edit Profile</a>
        <a class="item" routerLink="/auth/login">Log Out</a>
      </div>
    </div>
  </div>
</div>

侧边栏：

<sui-sidebar class="inverted vertical" #sidebar>
  <a class="item">1</a>
  <a class="item">2</a>
</sui-sidebar>

base：

<app-topbar></app-topbar>
<sui-sidebar-container class="ui bottom attached segment">
  <app-sidebar></app-sidebar>
  <sui-sidebar-sibling [isDimmedWhenVisible]="true">
    <div class="ui container" style="margin-top: 50px;">
      <router-outlet></router-outlet>
    </div>

    <div class="ui basic segment">
      <h3 class="ui header">Content</h3>
      <p>Example content beside the sidebar</p>
      <button class="ui button" (click)="sidebar.open()">Open Sidebar</button>
    </div>
  </sui-sidebar-sibling>
</sui-sidebar-container>

由于我将其与其他组件一起使用，因此侧边栏切换不起作用

请帮助我如何使这项工作

我希望将其与不同的组件分开

谢谢

ng2来自其他组件的语义UI侧边栏不起作用

0 个答案: