首页 > 解决方案 > 角度路线不会改变

问题描述

我在将一个组件加载到另一个组件中时遇到问题。它只是不显示,但在浏览器中路线发生了变化,但我的组件没有更新......

所以我有:

--homepage
--coins--
       --coinspreview  <-- i cannot access this component;
--services

应用组件.html

<app-homepage>
</app-homepage>

应用主页.html


<section id="home">
  <div class="bg">
    <img class="my-bg" src="/assets/images/bg.jpg">
  </div>
  <div class="container middle">
  <div class="row">
    <div class="col-lg-12 col-sm-12 col-12">
      <div class="hero">
       <h4 class="hero-title">
         Top 100 Cryptocurrency
       </h4>
      </div>
    </div>
  </div>
</div>
</section>

<section id="coins">
<app-coins></app-coins>

//here it shows my another component
</section>

app-coins.html

 <div class="container">
          <div class="row justify-content-center align-items-center">
            <div class="col-lg-3 col-md-4 col-sm-6 col-6" *ngFor="let coin of coins$ | async">
              <div class="main" [routerLink]="['./coins/coins-preview']">
              <img class="mini" src="{{coin.image}}" alt="{{coin.name}}" />
              <div class="name">{{coin.name}}</div>

              <div class="prices">
                <p class="coin-price">
                 Pret actual: {{coin.current_price}}
                </p>
                <p class="coin-market-cap">
                  Capitalizare: {{coin.market_cap}}
                </p>
              </div>
            </div>
            </div>
          </div>
      </div>

这是我在 app-routing-module 中的所有路由。

const routes: Routes = [
  {
    path: '',
    redirectTo: 'homepage',
    pathMatch: 'full'
  },
  {
    path: 'homepage',
    component: HomepageComponent
  },
  {
    path: "coins",
    component: CoinsComponent,
    children: [
             {
               path: "coins/coins-preview",
               component: CoinsPreviewComponent
             }
             ]
  }
];

我不知道还能做什么.. 我被卡住了,但我不明白为什么它不加载????

标签: htmlangulartypescript

解决方案


定义子路由时不要重复父路由名称。这应该使它工作


推荐阅读