Переменная с именем 'id' не работает в угловой интерполяции - PullRequest
Новая
       33

Переменная с именем 'id' не работает в угловой интерполяции

0 голосов
/ 24 октября 2019

Я изучаю Angular, использую CLI версии 8.3.8

Так что я потратил несколько часов, пытаясь выяснить, почему не работают такие имена, как показано ниже:

user. ts 

export class User {
    id: number
...

app-routing.module.ts 

const routes: Routes = [
    { path: 'details/:id', component: UserDetailComponent }
...

user-list.component.html 

<a *ngFor="let user of users" routerLink="/details/{{ user.id }}">
    <span>{{user.id}}</span>
...

Каждый другой файл имеет каждый параметр, соответствующийuser.id назван просто 'id'.

Когда я нажимаю на ссылку из user-list.component.html , я получаю следующую ошибку: 

core.js:6014
ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'detail'
Error: Cannot match any routes. URL Segment: 'detail'
...

а также user.id в <span> не отображается.

После того, как я возился с routerLinks и путями, я начал произвольно менять 'id' на 'userId' и когда user-list.component.html выглядит так: 

<a *ngFor="let user of users" routerLink="/detail/{{ user.userId }}">

работает без внесения каких-либо других изменений в другие файлы. То же самое касается элемента <span>.

Я также столкнулся с противоположной ситуацией, когда другое свойство - user.name будет хорошо отображаться с {{ user.name }}, но при изменении имени атрибута на user.userName и его замене. везде, например, {{ user.userName }} не работает и имя не отображается.

Пользовательские данные извлекаются из простой настройки сервера, где имена свойств User Java-бина userId и name,поэтому я считаю, что это как-то связано с этим, но почему шаблон компонента - это единственное место, где мне нужны имена свойств на сервере и в клиенте для сопоставления? (и почему user.service.ts не затрагивается этим вообще со всеми его http-запросами?)

...