角度|按ID

Question

我的应用程序中有子导航（/ items）：

<ng-container *ngFor="let item of items">
    <button md-button>
        <a [routerLink]="['/item-detail/', item.id]">
        <div class="first">
            <md-icon>live_help</md-icon>
                   <h2>{{item.title}}</h2>
        </div>
         </a>
    </button>
</ng-container>

它通过加载我在数组中的项目来工作：

 items = [
      {
        id: 1,
        title: 'Item 1',
        textContent: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras rhoncus enim purus, ac posuere nibh facilisis sit amet. Nam congue venenatis dictum. Donec non dui porttitor, rutrum lectus at, pharetra ante. Nulla facilisi. Quisque lectus sapien, finibus eget ullamcorper nec, iaculis ac risus. Sed in enim eget tellus mattis interdum ac eu urna. Ut erat ante, efficitur vitae egestas vel, fringilla iaculis enim. Vivamus laoreet est ex, in rutrum ipsum pellentesque faucibus.'
      }
    ];

通过点击按钮，应用程序路由到 / items / item-detail / 1 （如果我的数组中有更多对象，也可以正常工作

在我的路由中，我为上述路线定义了一个详细信息组件：

 path: ':id',
                component: ItemDetailComponent,
                data:
                {
                   title: 'Item Detail',
                }

路由似乎有效，但每当我尝试在HTML中显示属性时，我都无法获得对象中所需的内容。

  <div class="text">
        <h2>Text Content</h2>
        <p>
                {{item.textContent}}
        </p>
    </div>

任何帮助表示赞赏

Answer 1

因为您只在路线中提供了商品ID：

<a [routerLink]="['/item-detail/', item.id]">

您需要使用服务在您的组件之间共享您的项目，或者在您的第二个组件中进行HTTP调用（通常是什么是routign）。