CODEWITHSUNDEEP
angularrouterlink
Shofol
Shofol

Reputation: 733

How to use a fully variable URL in routerLink param

Let, I have an URL like below (I am actually getting it by get method)-

/glaccounts/pending_tasks?taskId=2&taskCommand="CreateGeneralLedgerAccount"

this URL resides on an object like this- {activity:"work", taskUI="/glaccounts/pending_tasks?taskId=2&taskCommand="CreateGeneralLedgerAccount"}

Now, how to use that in routerLink? The code below is not working-

<ul class="weekly-weather">
    <li *ngFor="let task of pendingTasks">
       <a [routerLink]="task.taskUI" [queryParams]="{taskId: '2', taskCommand: 'CreateGeneralLedgerAccount'}">
           {{task.activity}}
       </a>
       <i class="material-icons">call_missed_outgoing</i>
    </li>
</ul>

(Note: Here, I am getting an array of objects in pendingTasks)

I have also tried

Last three throw errors obviously. :P

Upvotes: 0

Views: 1853

Answers (1)

user4676340
user4676340

Reputation:

routerLink accepts an array of strings or strings.

Make a function that creates an array of strings, then use it 

toLink(url: string)  {
  const arr = url.split('/');
  if (arr[arr.length - 1] === '') { arr.pop(); } // remove the last empty item
  if (arr[0] === '') { arr.shift(); } // remove the first empty item
  return arr;
}



<a [routerLink]="toLink(task.taskUI)">

Also remember, this will work if you want to go down in the URL tree. This means that this route must be a child of the route you're on.

Upvotes: 1

Related Questions