Question

我创建了那些模拟用户：

private mockUsers =
    {
      "cristian@correo.com": {
        name: "Cristian Sures Vera",
        gender: "male",
        birthday: "1995-12-29",
        city: "Telde",
        phone: "686722255",
        email: "cristian@correo.com",
        type: "doctor",
        password: "1234"
      },
      "antonio@correo.com": {
        name: "Antonio Perez Perez",
        gender: "male",
        birthday: "1990-04-22",
        city: "Las Palmas",
        phone: "444555666",
        email: "antonio@correo.com",
        type: "patient",
        password: "1234",
        exercises: {}
      }
    };
  getUsers() {
    return this.mockUsers;
  }

我正试图表明这样做：

search.html

  <ion-searchbar (ionInput)="search($event)" ></ion-searchbar>
  <ion-list>
    <ion-item *ngFor="let user of users" >
      {{user}}
    </ion-item>
  </ion-list>

search.ts

  private users;

  constructor(public navCtrl: NavController, public userProvider: UserProvider) {
    this.users = userProvider.getUsers();
  }

  search(event){
    this.users = this.userProvider.getUsers();

    let val = event.target.value;

    if (val && val.trim() != ''){
      for (let key in this.users) {
        if(searchValueIsInTheUsername(this.users[key])){
          return this.users[key];
        }
      }
    }

    function searchValueIsInTheUsername(user: any) {
        return user['name'].toLowerCase().includes(val.toLowerCase());
    }
  }

我必须打印所有用户并且无法使用*ngFor因为它是一个对象而不受支持。我是否必须更改返回对象的表单？或者我有另一个表单来显示*ngFor中的所有用户？

所有项目都在搜索患者分支上的github上公开

Answer 1

这取决于你的api返回类型。如果你休息api正在返回用户列表，那么最好以相同的格式存储Json。要将对象转换为列表并能够使用它，请进行以下更改：

private mockUsers: any[] =
[
  "cristian@correo.com": {
    name: "Cristian Sures Vera",
    gender: "male",
    birthday: "1995-12-29",
    city: "Telde",
    phone: "686722255",
    email: "cristian@correo.com",
    type: "doctor",
    password: "1234"
  },
  "antonio@correo.com": {
    name: "Antonio Perez Perez",
    gender: "male",
    birthday: "1990-04-22",
    city: "Las Palmas",
    phone: "444555666",
    email: "antonio@correo.com",
    type: "patient",
    password: "1234",
    exercises: {}
  },
  "another@correo.com": {
    name: "Another mock user",
    gender: "male",
    birthday: "1990-04-22",
    city: "Las Palmas",
    phone: "444555666",
    email: "another@correo.com",
    type: "patient",
    password: "1234",
    exercises: {}
  }
   ] ;

无法在离子上显示物体

1 个答案: