标识符是指私有成员

Question

我试图在角度定义model并使用html。 这是我的代码：

'user.model.ts'

export class User{
  private name: string;


  constructor($name: string){
    this.name = $name;
  }


    public get $name(): string {
        return this.name;
    }


    public set $subject(value: string) {
        this.name = value;
    }
}

component.ts

myUsers: Array<User>;

ngOnInit(){
   //api call 
   this.myUsers= resultFromAPi;
}

component.html

<div *ngFor="let user of myUsers">
    {{user.name}}
</div>

现在，尽管在用户界面中，我仍然可以看到该名称，并且可以正常使用。 但是同时在我的代码编辑器（VS代码）中，我看到一个错误：

[Angular] Identifier 'name' refers to a private member of 'User'

我知道我可以通过将字段公开来解决错误，但是我认为那是不好的设计。

更新

{{user.$name}}甚至不在用户界面上显示名称

Answer 1

那么，在定义名为$name的公共获取方法时，为什么模板代码包含{{user.name}} ？

{{user.name}}

应该

{{user.$name}}

---

或更改您的User类成员名称。 其他对我来说没有意义的代码是调用setter $subject 。 如果在您创建代码后我继承了您的代码或必须在模板中执行某些操作，这会使我感到困惑。 为您的字段和访问属性使用直观一致的名称。

就我个人而言，我将只有一个公共字段name 或一个带有公共getter name的私有字段$name name 。

---

似乎完全基于这种问题的趋势，代码中仍存在未显示的问题，我建议您仅基于传入的json创建一个接口，然后从服务中返回该接口。

import { HttpClient } from '@angular/common/http';

export interface IUser {
  name: string;
}

export class UserService {

  constructor(private httpService: HttpClient) {}
  getUsers(): Observable<IUser[]> {
     return this.httpService.get<IUser[]>('your user end point here');
  }
}

Answer 2

当我们使用AOT（提前）编译器时，所有模板成员（例如属性和方法）必须在公共位置定义。 如果要使用提前编译，则无法访问模板中的私有属性。