0

我正在学习 Angular，运行 CLI 版本 8.3.8

所以我花了几个小时试图弄清楚为什么像下面这样的命名不起作用：

用户.ts

export class User {
    id: number
...

应用程序路由.module.ts

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

用户列表.component.html

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

每个其他文件都有对应于名为“id”的 user.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 }}不起作用并且名称不显示。

用户数据是从一个简单的服务器设置中检索的，其中Userjava bean 的属性名称是userIdand name，所以我认为它必须对此做一些事情，但是为什么组件模板是我需要服务器和客户端中的属性名称的唯一地方匹配？（为什么user.service.ts的所有 http 请求都不受此影响？）

4

0 回答 0