Как использовать динамические ссылки маршрутизатора с методом

#angular

Вопрос:

Я создаю приложение Angular 7. В этом приложении я получил набор ссылок. При загрузке страницы для каждой из ссылок срабатывает getRouterURL (и каждый раз, когда я нажимаю на одну из ссылок, все запускают метод. Правильное ли это поведение? Это похоже на пустую трату памяти?

 <a [routerLink]="getRouterURL('normal')">Link</a>
<a [routerLink]="getRouterURL('normal')">Link 2</a>
<a [routerLink]="getRouterURL('page')">Link 3</a>
<a [routerLink]="getRouterURL('page')">Link 4</a>

Метод выглядит следующим образом.

 getRouterURL(type) {
  console.log('Method fired');
  if (type === 'normal') {
    return 'normal'   this.proposalId   '/'   model.id;
  } else {
    return 'pages'   this.proposalId   '/'   model.id;
  }

}

Правильно ли я это делаю?

1. что именно делает getRouterURL?

2. Возвращает URL-адрес на основе типа модели.

3. Вы можете использовать [routerLink]="..." , когда хотите создать динамический URL, например, [routerLink]="['a', 'b', some_var_id]"

4. Не могли бы вы сначала выполнить вызов, затем сохранить его в переменной, затем выполнить цикл for поверх a и инициализировать [routerLink] использование сохраненного маршрута??

5. Каждая ссылка может быть либо типа normal, либо типа page. Поэтому это должно быть отражено в ссылке.

Ответ №1:

Это нормальное поведение. Angular не имеет способа узнать, изменилась ли эта привязка. Он может узнать это, только выполнив функцию снова. Вот почему обычно лучше ограничить количество привязок вызовов функций внутри вашего шаблона. Вы можете либо решить это с помощью @Input() , который каким-то образом устанавливает данные, или, что еще лучше, с помощью чистого @Pipe

1. Так что не имеет значения, срабатывает ли метод много раз? Это очень просто, так что, я думаю, нет?

2. @JonathanClark Это не должно иметь значения для такой функции, как эта, но будьте осторожны с ними и не вкладывайте в них много логики. Лучше кэшировать его или использовать канал 🙂