Typescript将对象转换为数组 - 因为* ngFor不支持对象的迭代

Question

• 我不想像这样使用for循环将Object转换为Array！如果加倍过程并降低app的性能（我使用Ionic2和Typescript，使用Firebase）

  for（let key in data）{     的Array.push（值）; }

是否有任何解决方案可以使用* ngFor。

迭代对象本身（如附图所示）

或者我可以将此Object（如附图所示）转换为Array，因此可以在* ngFor中进行迭代。

Answer 1

您可以使用 Object.keys（obj）来获取命名索引。这将返回一个数组结构，您可以进一步使用/自定义。迭代对象值的示例用法可能如下所示

var persons = { 
    john: { age: 23, year:2010},
    jack: { age: 22, year:2011},
    jenny: { age: 21, year:2012}
}

获取迭代器

var resultArray = Object.keys(persons).map(function(personNamedIndex){
    let person = persons[personNamedIndex];
    // do something with person
    return person;
});

// you have resultArray having iterated objects 

Answer 2

自Angular 6起，现在有一个键值管道运算符。简单执行以下操作：

*ngFor="for item in objectList | keyvalue"

item.key # refers to the keys (134, 135...) in your example
item.value # refers to the object for each key

Answer 3

如果不需要索引，则可以使用Object.values（yourObject）来获取内部对象的数组。

Answer 4

只需将响应数据放在方括号中，然后将其保存在类中即可。

this.servicename.get_or_post().subscribe(data=>
   this.objectList = [data]);

Answer 5

在管道上添加toArray（）对我有用。

// Import toArray function
import { toArray } from 'rxjs/operators';

// Generic function to consume API
searchObjects(term: string): Observable<theObject[]> {
  requestUrl = this.url + term;
  return this.http.get<theObject[]>(requestUrl, httpOptions).pipe(
      // convert object to array
      toArray<theObject>()
  );
}