Question

我创建了一个公司简介组件，该组件独立于其自己的页面。但是我需要在应用程序的其他地方使用它，因此我定义了选择器，如下所示：

selector: 'company-profile'

我在左侧有一个永久性的导航栏，在顶部有一个永久性的工具栏，它们是单独的组件，位于app.component.html中，因此所有页面都应将其内容呈现在toolbar下并navbar的右侧。

但是，当我在@Component中创建选择器时，页面忽略了toolbar和navbar并在其下方展开。当我注释掉选择器时，一切正常。而且，当我在应用程序的其他位置使用<company-profile></company-profile>时，它也可以正常运行。

app.component.html

<div fxLayout="row">
  <tn-nav style="z-index:5;"></tn-nav>
  <div fxFlex fxLayout="column">
    <tn-toolbar></tn-toolbar>
    <router-outlet></router-outlet>
  </div>
</div>

company-profile.component.ts

@Component({
  selector: 'company-profile',
  templateUrl: '../html/company-profile.component.html',
  styleUrls: ['../styles/company-profile.component.scss',
      '../../../shared/styles/buttons.shared.scss'],
})

在另一个组件中

<div fxFlex="75">
  <company-profile></company-profile>
</div>

控制台中也没有错误。似乎是什么问题？

在角度组件中定义选择器会破坏我的布局

0 个答案: