Ссылка routerLink из функции
Мой вопрос очень похож на это, но у меня он не работает. Я уже спрашивал у автора, но ответа не получил, так что вот. Я в основном хочу генерировать ссылки из функции:
generator(linkFor, linkPath){
if (linkFor == 'msg'){
// now linkPath is something like 2/4
// and the route to read the message is message/view/2/4
return 'message/view/' + linkPath
}
}
и условия if продолжаются. Из шаблона делаю:
<a href = "javascript:void(0)" [routerLink] = "generator(data.type, data.source)">{{data.source_name}}</a>
Теперь ссылка генерируется, но добавляет ():
message/view/(2/4)
и, следовательно, его нельзя найти. Откуда брекеты?
@porgo в приведенном выше условии, если, например, это будет «2/4». Это всегда строка, и она будет зависеть от типа. Иногда это будет «4», иногда «привет» на основе data.type, конечно, как отправлено бэкэндом
сделайте console.info, чтобы проверить фактическое значение для linkPath перед возвратом и опубликовать его.
@Mic Я уже сделал это на самом деле, и это дает: сообщение/просмотр/3/45
Ответы 2
generator(linkFor, linkPath){
if (linkFor == 'msg'){
return ['message', 'view', linkPath]
}
return null;
}
спасибо за помощь. Попробовал ваш путь, а также сделал linkPath массивом, чтобы в конце он давал [message, view, 3,4], но все же добавлял (). Позвольте мне взглянуть на это с другой стороны
Существует проблема производительности с логикой [routerLink] выше. Каковы недостатки, позвольте мне прийти первым
Попробуй это :
<a href = "javascript:void(0)" [routerLink] = "generator(data.type, data.source)">Test</a>
generator(linkFor, linkPath){
console.info('Generate URL for me');
}
Примечание. Теперь проверьте, сколько раз печатается консоль. Причина в том, что этот асинхронный вызов вызывается и замедляет работу приложения.
так что вот еще один способ, которым мы можем генерировать ссылки из функции
<a href = "javascript:void(0)" (click) = "generator(data.type, data.source)">Test</a>
import { Router } from '@angular/router';
constructor(private _router: Router)
generator(linkFor, linkPath){
console.info('Generate URL for me');
if (linkFor == 'msg'){
this._router.navigate(['message/view/' + linkPath])
}
}
Примечание. Теперь журнал проверки консоли печатается только один раз, что является более эффективным способом реализации генерации ссылок из функции.
Короче говоря, асинхронный вызов [routerLink] достигает бесконечности функции, даже если действие пользователя не выполняется. (щелчок) будет работать только в соответствии с действиями пользователя.
спасибо, что открыл мне глаза. Я видел, как моя консоль печатала 3-4 раза, и я не был уверен, почему, поскольку у моего ngFor была только одна запись. Ваше объяснение имеет смысл. Но, к сожалению, ссылки должны быть сгенерированы на ngFor, и я не знаю, какой элемент нужно будет (щелкнуть), поскольку ссылки либо через веб-сокеты, либо при инициализации компонента. Но я ценю объяснение.
Пожалуйста, проверьте обновленное решение, которое будет работать для ngFor
что такое
data.sourceстоимость?