问题
reason of using nested route for me is handling dynamically icon and back button for every page.i have abstract route because when i click to back button route params disappear and i put an abstract path to keep id
and questionnaire
type parameter in url.my abstract path is Questionaire
{ path: 'Home', component: HomeComponent,data:{icon:'fa-home'} },
{ path: 'QuestionaireList', component: QuestionaireListComponent,data:{icon:'fa-list-ul',previousState:'/Home'} },
{
path: 'Questionaire/:questionnaireType/:id',
children:[
{ path: 'AddQuestionnaire', component: CreateQuestionnaireComponent,data:{icon:'fa-plus',previousState:'/QuestionaireList'} },
{ path: 'UpdateQuestionnaire', component: EditComponent,data:{icon:'fa-pencil',previousState:'/QuestionaireList'} },
{ path: 'QuestionList', component: QuestionListComponent,data:{icon:'fa-pencil',previousState:'/QuestionaireList'} },
{ path: 'ImportQuestion', component: ImportQuestionComponent,data:{icon:'fa-plus',previousState:'/QuestionaireList'} },
{ path: 'MetaContentList', component: MetaContentListComponent,data:{icon:'fa-database',previousState:'/QuestionaireList'} },
{ path: 'ModifyMetaContent/:metaContentId/:title', component: ModifyMetaContentComponent,data:{icon:'fa-database',previousState:'/MetaContentList'}},
]}
Also in questionnaire.list.html
i link to every path by routerlink
bellow is one my link :
[routerLink]="['/Questionaire',item.questionnaireType,item.id,'/UpdateQuestionnaire']"
this is my link :
<a class="primary small ui icon button" [routerLink]="['/Questionaire',item.questionnaireType,item.id,'/UpdateQuestionnaire']" >
<i class="edit icon"></i>
</a>
I expected when i click on link i route to this address:
.../Questionaire/1/b8b55b42-f39f-4359-93d0-0260ddf3827f/UpdateQuestionnaire
But this error occured
Cannot match any routes. URL Segment: 'Questionaire/1/b8b55b42-f39f-4359-93d0-0260ddf3827f/%2FUpdateQuestionnaire'
actually routerlink add %2f before UpdateQuestionnaire. why is this happening? what's wrong in my code
回答1:
Have you tried removing the slashes in your Router link like so:
[routerLink]=['Questionaire', item.questionnaireType, item.id, 'UpdateQuestionnaire']
?
There seems to be a problem with slashes in routerlink as described in this post
I would post this as a comment, but since I don't have enough reputation I will post this as an answer, sorry about that.
I hope this clears stuff up for you.
Kind regards Chris
来源:https://stackoverflow.com/questions/48080048/angular4-route-issue-by-adding-2f-character-before-path