Angular2路由器插座组件正在进行风格定位

时间:2017-05-17 15:10:32

标签: css angular

我是AngularJS的新用户,我正在做一个基本应用程序,显示来自API调用的汽车列表。

我面临的问题是,我放弃了这个问题,使用<router-outlet></router-outlet>调用的组件有一个style="position: fixed"而且我不知道它来自哪里,哪个阻止我滚动页面以显示表格中的所有条目。

我尝试使用:host以多种方式更改CSS但没有成功。

这是我的应用模板:

<div mdl class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
      <header class="mdl-layout__header">
        <div class="mdl-layout__header-row">
          <!-- Title -->
          <span class="mdl-layout-title">SO-Angular2-ts</span>
          <!-- Add spacer, to align navigation to the right -->
          <div class="mdl-layout-spacer"></div>
          <!-- Navigation. We hide it in small screens. -->
          <nav class="mdl-navigation mdl-layout--large-screen-only">
            <a routerLink="" class="mdl-navigation__link" href="">Car</a>
            <a routerLink="driver" class="mdl-navigation__link" href="">Driver</a>
            <a routerLink="add-edit-form" class="mdl-navigation__link" href="">Edit / New</a>
          </nav>
        </div>
      </header>

      <main class="mdl-layout__content">
        <div class="page-content">
          <router-outlet></router-outlet>
        </div>
      </main>
    </div>

当我启动应用程序时,我遇到了这个问题:

demo

1 个答案:

答案 0 :(得分:2)

我怀疑Angular是这样做的。这些组件是host: [...]还是@HostBinding('style.position')...