ngFor 遍历对象

Question

我试图遍历一个对象。我尝试了以下方法：

管道：

@Pipe({name: 'keys'})
export class KeysPipe implements PipeTransform {
  transform(value, args:string[]) : any {
    if (!value) {
      return value;
    } 

let keys = [];
for (let key in value) {
  keys.push({key: key, value: value[key]});
} 
return keys;

} }

在我的 html:

<div *ngIf="details">
<li *ngFor=" let entry of details| keys">           
{{entry.key}},  {{entry.value}}
</li>

它的工作原理，但它显示了我的整个对象。我只需要对象的某些键。所以我可以做这样的事情（这是一个里面有数组的对象，如果它只是一个对象，这种方法是行不通的）：

<button ion-item *ngFor="let movie of movies?.results" (click)="goToDetails(movie.id)">
  <h2>{{movie.title}}</h2>
{{movie.overview}}
</button>

Answer 1

您需要实施过滤器管道或将参数（所需的属性名称）传递给您的管道：

<li *ngFor=" let entry of details| keys:'name', 'value'">
//or
<li *ngFor=" let entry of details| keys | filter">

for (let key in value) {
  if(!Array.isArray(args) || args.length === 0 || args.indexOf(key) > -1)
  keys.push({key: key, value: value[key]});
} 

<li *ngFor=" let entry of details| keys:'name'">           
{{entry.key}},  {{entry.value}}
</li>

ngFor 遍历对象

ngFor loop through Object

loops

ngfor

angular