Search code examples
angularangular-ui-router

Parameters URL request, undefined


I want to have a button that redirect me to an url like this: task-details/1

For this, in HTML I did something like this:

  <ul *ngFor="let task of tasks" class="list-group list-group-flush">
     <li class="list-group-item">
         {{task.description}} <button class="btn-success" [routerLink]="['/task-details', task.id]"></button>
     </li>
  </ul>

router:

{path: 'task-details/:id', component: TaskDetailComponent}

When I clicked the button, I received: task-details/undefined. For {{task.description}} it appears the correct values. How can I rewrite the routerLink for receive: task-details/1 ?


Solution

  • Try this:

      <ul *ngFor="let task of tasks" class="list-group list-group-flush">
         <li class="list-group-item">
             {{task.description}} <button class="btn-success" routerLink="/task-details/"+task.taskId></button>
         </li>
      </ul>