0

テンプレートのクラスにバインドされたデータから routerLink をバインドしようとしています。angular.io docs によると、テンプレートの構文は正しいようです。アプリケーションとコンポーネントの両方のレベルで ROUTER_PROVIDERS と ROUTER_BINDINGS (どちらも謎のまま) を試してみましたが、役に立ちませんでした。私のコードは「helpfull」エラーをスローします:TypeError: linkParams.reduce is not a function in [[ 'ClassDetail', {id: class._id} ] in ]

テンプレート：

<div class="container" >
  <div class="row">
    <div class="col-md-4 block" *ngFor="#class of classes | async">
      <h2>{{class.title}}</h2>
      <p>{{class.description}}</p>
      <p><a class="btn btn-default" routerLink="[ 'ClassDetail', {id: class._id} ]" role="button">View details &raquo;</a></p>
    </div>
  </div>
</div>

routerLink がなければ、これはうまくレンダリングされます。

ルート構成:

@RouteConfig([
  { path: '/', component: Home, name: 'Index' },
  { path: '/home', component: Home, name: 'Home' },
  { path: '/about', component: AboutComponent, name: 'About' },
  { path: '/classes/:id', component: ClassDetailComponent, name: 'ClassDetail'}
])
4

1 に答える 1

0

そのようなものを使用する必要があります。

<p>
  <a class="btn btn-default"
     [routerLink]="[ 'ClassDetail', {id: class._id} ]" role="button">
    View details &raquo;
  </a>
</p>

実際router-linkのところ、 Angular2 のディレクティブです。 ドキュメントのこのリンクを参照してください。

バインド可能な入力で構成する必要があります (そのため、角かっこを追加する必要があります)。これにより、ディレクティブにパラメーターを与えることができます。詳細については、属性ディレクティブ ドキュメントの「バインディングを使用してディレクティブを構成する」セクションを参照してください: https://angular.io/docs/ts/latest/guide/attribute-directives.html。

お役に立てば幸いです、ティエリー

于 2016-01-04T15:13:40.650 に答える