格式routerLink PARAM網址

在我的角度2應用程序，我定義了諸如路由器鏈接：格式routerLink PARAM網址

<a *ngFor="let demo of demos" [routerLink]="['demo', demo.name]">example</a>

目前我正在demo.name爲「example.net/demo/A%20%demo%20%測試」。我想將其格式設置爲「example.net/demo/a-demo-test」以在瀏覽器地址欄中顯示。

任何幫助，將不勝感激。

來源

2017-03-22 Sumit Chaudhari

嘗試與破折號代替空格。例如：'[routerLink] =「['demo'，demo.name.replace（/ \ s +/g，' - '）]'' – Titus

@JaroslawK。我在每個模塊中分別定義了路由。 –

@Titus我試過你的解決方案，這給了我錯誤「模板解析錯誤：解析器錯誤：意外的令牌/在第35列」。 –

您可以使用routerLink中的函數。所以，你可以在你的組件中使用函數：

hyphenateUrlParams(str:string){ 
    return str.replace(' ', '-'); 
    }

而在你routerLink使用它：

[routerLink]="['/demo', hyphenateUrlParams(demo.name)]"

這提供了更多的重用性不是直接的routerLink內變異變量。

來源

2017-03-22 17:30:47

創建一個將空格轉換爲連字符的管道。

@Pipe({ 
    name: 'kebabCase' 
}) 
export class KebabCasePipe implements PipeTransform { 

    transform(value: string): string { 
     return value.replace(' ', '-'); 
    } 

}

使用管道在鏈接：

<a *ngFor="let demo of demos" [routerLink]="['demo', demo.name | kebabCase]">example</a>

來源

2017-03-22 17:37:18 Martin

格式routerLink PARAM網址

回答

相關問題