如何通过在[routerLink]路线PARAMS角2

我试图创建角2的应用程序，并且希望通过PARAMS标记一个在[routerLink]我想了解创建这样一个链接：如何通过在[routerLink]路线PARAMS角2

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

我不知道如何通过模板cell ...

来源

2016-05-29 Alireza Valizade

的可能的复制[Angular2 Routerlink：添加查询paramters（http://stackoverflow.com/questions/35226245/angular2-routerlink-add-query-参数 –

如果你打算使用angula2测试那么你必须发送参数像这样同时做路由。

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

而不是在接收方比你必须通过使用RouteParams得到参数。

螺母，如果你打算使用angular2 RC比你要使用RouteSegment而不是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-29 06:57:50

我不想要使用这种方式，但它的确定，以及如何绑定这？我想在输入单元格参数绑定在标签上键入。 –

而不是仅仅将输入字段值绑定到'[（ngModel）]'并且将该变量作为routerParameter传递。 @AlirezaValizade看到我更新的答案。 –

'<形式[ngFormModel] = “模型”（ngSubmit）= “提交（）”>

تلفن همراه

' 我使用FormBuilder和不工作 –

你可以试试下面的代码：您的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-29 06:56:40

你可以绑定使用[（ngModel）]并使用routeParams –

在Angular2中同时支持路由中的查询参数和路径变量。

使用，如：

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

和组件：

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

然后在URL所示一样，你要/auth/signup?cell=1654654654

NB：

如果在你的路径包含电池在组件中作为参数如：/auth/signup/:cell和routelink类似于：[routerLink]="['Signup', {cell: '1654654654'}]"那么URL会显示这样的：auth/signup/1654654654

来源

2016-05-29 07:25:46

已经提到所有答案的内容已存在的答案没有新的答案。 –

在哪个答案中？@PardeepJain –

看到我的回答@Shaileshab –

您可以queryParams与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-09 05:48:14 Akash

接受的答案已过时，恕我直言，不回答问题。

但是问题并不清楚：“路由参数”在路径部分URL中，但问题是关于“查询参数”后面的'？' （问号）。

所以，这个问题的答案是在answer of @Akash：你在模板中使用

[queryParams]="{name: value}"

。

因此，这锚将参照/path/with/myparam?cell=1654654654：

<a [routerLink]="['/path/with/:paramName', {paramName: "myparam"}]" 
    [queryParams]="{cell: 1654654654}" 
></a>

来源

2017-06-04 10:51:54

如何通过在[routerLink]路线PARAMS角2

回答

相关问题