Question

我想为我的用户总计并显示它，但出现此问题

[ts]类型“可观察的用户”不存在属性“长度”。 [2339]

这是我的ts文件

  users: Observable<User[]>;
  totalEmplyees:number;
  constructor(private UserService: UsersService) { }

  ngOnInit() {
    this.reloadData();
  }
  reloadData() {
    this.users = this.UserService.getUsers();
    console.log(this.users)
    this.getTotalEmplyees();
  }
  getTotalEmplyees(){
    let total = 0 ;
   
    for (let index = 0; index < this.users.length; index++) {
      total +=  1 ;
    
    }
    this.totalEmplyees = total;
    
    console.log(this.totalEmplyees);
  
  }

我希望somone为我提供解决此问题的方法。

Answer 1

如果getUsers()是可观察的，则可以尝试此操作。 users不必是可观察的。

reloadData() {
    this.UserService.getUsers().pipe(take(1))
      .subscribe((users: any) => {
        this.users = users;
      });
    console.log(this.users)
    this.getTotalEmplyees();
  }

如果getUsers()也不是可观察的，那么users也不应是可观察的

Answer 2

您的服务返回一个Observable，您应该使用约定以$结束Observable名称。然后，您应该使用模板中的异步管道来订阅users $。

  users$: Observable<User[]>;

  constructor(private UserService: UsersService) { }

  ngOnInit() {
    this.users$ = this.UserService.getUsers();
  }

在您的模板中，您可以将订阅分配给一个名为用户的视图变量，然后访问长度peoperty以获取有多少。

<div *ngIf="users$ | async as users">
  There are this many users: {{users.length}}
</div>

在这里，我们使用了异步管道来订阅可观察对象，并将数组分配给一个名为用户的视图变量。最好以这种方式在模板中而不是在TypeScript中管理对Observable的订阅，并且不必担心取消订阅。

遍历数组以计算有多少是不必要的，因为那已经是数组的length属性。

长度属性与可观察对象不存在

2 个答案: