15

angular 2でアプリケーションを作成しようとしています.[routerLink]でタグ付けするパラメータを渡したいのですが、次のようなリンクを作成したいです:

<a href="/auth/signup?cell=1654654654"></a>

cellテンプレートを渡す方法がわかりません...

4

5 に答える 5

13

queryParamswhich works を使用しrouterLinkて を構築できますurl。例：

<a [routerLink]="['/profiles']" 
[queryParams]="{min:45,max:50,location:29293}">
  Search
</a>

これは次のようなルートを構築しますhttp://localhost:3000/profiles?min=45&max=50&location=29923

幸運を。

于 2016-11-09T05:48:14.963 に答える
10

angula2 betaを使用する場合は、ルーティング中にこのようなパラメーターを送信する必要があります。

<a [routerLink]="['signup',{cell:cellValue}]">Routing with parameter</a>                        
<input type='text' [(ngModel)]='cellValue'>

受信側よりも、を使用してパラメーターを取得する必要がありますRouteParams。

RouteSegmentangular2 RC で使用する代わりに、Angular2 RCを使用する場合はナットを使用する必要がありますRouteParams。このような ：-

import { Component } from '@angular/core';

import { Routes, RouteSegment, ROUTER_DIRECTIVES } from '@angular/router';

@Component({
  selector: 'about-item',
  template: `<h3>About Item Id: {{id}}</h3>`,
  Directives: [ROUTER_DIRECTIVES]
})

class AboutItemComponent { 

  id: any;

  constructor(routeSegment: RouteSegment) {
    this.id = routeSegment.getParam('id');    
  }
}

@Component({

    selector: 'app-about',

    template: `

      <h2>About</h2>
        <a [routerLink]="['/about/item', 1]">Item 1</a>
        <a [routerLink]="['/about/item', 2]">Item 2</a>
      <div class="inner-outlet">
        <router-outlet></router-outlet>
      </div>
    `,
    directives: [ROUTER_DIRECTIVES]
})

@Routes([

  { path: '/item/:id', component: AboutItemComponent }

])

export class AboutComponent { }
于 2016-05-29T06:57:50.543 に答える
2

Angular2 では、ルーティング内でクエリ パラメータとパス変数の両方がサポートされています。

次のように使用します。

<a [routerLink]="['Signup', {cell: '1654654654'}]">Signup</a>

そしてコンポーネントで：

@RouteConfig([
    new Route({ path: '/auth/signup', component: SignupComponent, name: 'Signup'})
])

次に、必要なようなURLに表示されます/auth/signup?cell=1654654654

注意:

/auth/signup/:cellパスに params like:および routelink like : としてコンポーネントのセルが含まれている場合、[routerLink]="['Signup', {cell: '1654654654'}]"URL は次のように表示されます。auth/signup/1654654654

于 2016-05-29T07:25:46.203 に答える
2

以下のコードを試すことができます: ts ファイルは次のようになります。

@Component({ ... })
@Routes([
    {
        path: '/auth/signup?cell=1654654654', component: AuthComponent
    }
])
export class AppComponent  implements OnInit {
    constructor(private router: Router) {}
}

そしてあなたのhtmlファイルでは、

<a [routerLink]="['//auth/signup?cell=1654654654']"></a>
于 2016-05-29T06:56:40.560 に答える