Question

我知道这似乎是一个非常简单的问题，但我陷入困境并需要一些帮助。想要使用角度2创建一个网站--i有我可以在控制台日志中看到的数据，但是当我试图获取HTML页面 - 什么都没有。

这是我的users.component.html页面

import { Component, OnInit } from '@angular/core';
import{FirebaseService} from '../../services/firebase.service';

@Component({
  selector: 'app-users',
  templateUrl: './users.component.html',
  styleUrls: ['./users.component.css']
})
export class UsersComponent implements OnInit {

users:any;

  constructor(private firebaseservice:FirebaseService) { }

  ngOnInit() {
    this.firebaseservice.getusers().subscribe(users=>{
      this.users=users;
      console.log(users);

    });
  }

}

Data Image

这是我的users.component.html页面

<ul class="list-group">
  <li class="list-group-item" *ngFor="let user of users">
    {{user.title}}
  </li>
  </ul>

Could not see any Data in Screen

Answer 1

据我所知，你有一个数组，其中包含一个带有结果的对象。 ng-for需要可迭代数据（Array），而结果并非如此。

您应该浏览对象并推送用户数组中的每个对象。您可以使用for ...来实现此目的

var result = {};
result.a = {name: 'test'};
result.b = {name: 'test2'};

var users = [];

for (let user in result) {
  users.push(result[user]);
}

然后你的用户数组应该是可迭代的。

在您的代码中，这应该是：

  ngOnInit() {
    this.firebaseservice.getusers().subscribe(users=>{
      for (let user in users) {
          this.users.push(users[user]);
      }
    });

我无法使用ngFor从数组中获取数据 - 不确定出了什么问题

1 个答案: