'void'类型中不存在属性'filter'。在角度

Question

我想在Promises返回值后执行过滤器，从服务获取值但不能进一步执行。

过滤器，地图没有任何适用于它。这里有什么问题，或者我们无法从退回的服务功能中应用过滤器。任何建议

错误：'void'类型中不存在属性'filter'。

这是我的服务。

loadUsers() {
    fetch('http://api.icndb.com/jokes/')
        .then((response) => {
            return response.json();
         }).then((data) => {
             this.values = data
             console.log(data);
         }).catch((ex) => {
             console.error('Error fetching users', ex);
    });
}

然后在我的component.ts中

export class SignUpComponent implements OnInit {
    ngOnInit() {
        this.newService.loadUsers().filter(res => res.id == '1');
    }

    constructor(private newService: MyDataService) { }
}

Answer 1

承诺。函数loadUsers()包含一个承诺。您需要先退回承诺：

loadUsers() {
  return fetch('http://api.icndb.com/jokes/')
  .then((response) => {
    return response.json();
  }).then((data) => {
    this.values = data
    console.log(data);
    return data;
  }).catch((ex) => {
    console.error('Error fetching users', ex);
  })
}

然后，

ngOnInit() {
    this.newService.loadUsers().then(function(users) {
        users.filter(res => res.id == '1');
    })
}

loadUsers（）返回一个promise，而不是像常规函数那样的值。这意味着，loadUsers（）需要时间来完成。如果是这样，promise对象包含现在解析的值。您可以使用<Promise object>.then()提取此值，return fetch('http://api.icndb.com/jokes/')...将函数作为参数。您传递给.then（在本例中为用户）的函数的参数包含您要查找的内容。

Answer 2

首先你的函数loadUsers不返回任何东西，你应该写：

    loadUsers() {
  return fetch('http://api.icndb.com/jokes/')
  .then((response) => {
    return response.json();
  }).then((data) => {
    this.values = data
    return data;
  }).catch((ex) => {
    console.error('Error fetching users', ex);
  })
}
ngOnInit() {
    this.newService.loadUsers()
            .then(res => {
               res.filter(res => res.id == '1');
            })

}

，除了我不确定我们承诺有过滤方法。可以这样做：

object

Answer 3

继续其他答案，你的json响应是value，filter是Array方法。 json响应包含

export class App {
  loadUsers() {
  return fetch('https://api.icndb.com/jokes/')
  .then((response) => {
    return response.json();
  }).then((data) => {

    return data.value;
  }).catch((ex) => {
    console.error('Error fetching users', ex);
  })
}

属性，它是对象的数组。看到plnkr

Demo

qazxswpoi