Селектор RouterLink - PullRequest
Новая
       22

Селектор RouterLink

0 голосов
/ 11 марта 2020

из официальных документов селектор директивы RouterLink: not (a): not (area) [routerLink] (это означает, что выберите все элементы с атрибутом routerLink, которые не являются элементами привязки или области, верно?)

Как тогда можно работать с тегом привязки следующим образом: 

<a [routerLink]="['/user/bob']" >
  link to user component
</a>

1 Ответ

2 голосов
/ 11 марта 2020

Есть 2 RouterLink директивы: 

@Directive({selector: 'a[routerLink],area[routerLink]'})
export class RouterLinkWithHref implements OnChanges, OnDestroy {
}

@Directive({selector: ':not(a):not(area)[routerLink]'})
export class RouterLink {
}

Между ними есть некоторые небольшие различия, которые, я думаю, команда Angular чувствовала бы лучше, поддерживая две разные директивы .

Но чтобы ответить на ваш вопрос, да, ваш пример HTML работает. Вероятно, вы найдете что-то эквивалентное этому использованию в 99,99% Angular проектов. 

<a [routerLink]="['/user/bob']" >
  link to user component
</a>

Различия

a[routerLink] имеют следующие дополнения: 

constructor(/*args*/) {
  this.subscription = router.events.subscribe((s: Event) => {
    if (s instanceof NavigationEnd) {
      this.updateTargetUrlAndHref();
    }
  }
}

ngOnChanges(changes: {}): any { this.updateTargetUrlAndHref(); }

И некоторая дополнительная обработка click - чтобы переопределить обработку кликов по умолчанию <a> и <area>.

Ссылки

Исходный код: https://github.com/angular/angular/blob/master/packages/router/src/directives/router_link.ts

Документы для a[routerLink]: https://angular.io/api/router/RouterLinkWithHref

Документы для :not(a)[routerLink]: https://angular.io/api/router/RouterLink

...