如何在 Angular2 中过滤 [ngForOf] 中的值?
How to filter the values inside [ngForOf] in Angular2?
pipe in angular2 ngForOf我是 Angular 的新手。现在我正在学习 ngForOf 概念。我正在尝试研究如何在 ngForOf 指令中绑定变量。请找到以下 codes.In AngularJS 我们可以直接绑定 ng-repeat 中的值但是我可以在 Angular2 中做什么?
app.component.ts:
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<h1>{{title}}</h1>
<ng-template ngFor let-item [ngForOf]="heroes" let-i="index">
<li>{{item}}</li>
</ng-template>
`
})
export class AppComponent {
title = 'Tour of Heroes';
heroes = ['Windstorm', 'Bombasto', 'Magneta', 'Tornado'];
}
在上面的代码中,我成功地显示了 heroes 数组的内容。
现在,我想在英雄上应用管道,并根据管道过滤数据,然后显示过滤后的数据。
app.component.ts:
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<h1>{{title}}</h1>
<ng-template ngFor let-item [ngForOf]="filteredData = (heroes | pipename : "data for pipe" " let-i="index">
<li>{{item}}</li>
</ng-template>
`
})
export class AppComponent {
title = 'Tour of Heroes';
heroes = ['Windstorm', 'Bombasto', 'Magneta', 'Tornado'];
}
期待任何形式的帮助。
谢谢
我之前在另一个问题上已经回答了几乎相同的问题,这可能会对你有所帮助。如果没有,请随时发表评论,我会提供帮助。
简而言之:不要为此使用管道。传递数据时在组件中过滤和排序。
pipe in angular2 ngForOf我是 Angular 的新手。现在我正在学习 ngForOf 概念。我正在尝试研究如何在 ngForOf 指令中绑定变量。请找到以下 codes.In AngularJS 我们可以直接绑定 ng-repeat 中的值但是我可以在 Angular2 中做什么?
app.component.ts:
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<h1>{{title}}</h1>
<ng-template ngFor let-item [ngForOf]="heroes" let-i="index">
<li>{{item}}</li>
</ng-template>
`
})
export class AppComponent {
title = 'Tour of Heroes';
heroes = ['Windstorm', 'Bombasto', 'Magneta', 'Tornado'];
}
在上面的代码中,我成功地显示了 heroes 数组的内容。
现在,我想在英雄上应用管道,并根据管道过滤数据,然后显示过滤后的数据。
app.component.ts:
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<h1>{{title}}</h1>
<ng-template ngFor let-item [ngForOf]="filteredData = (heroes | pipename : "data for pipe" " let-i="index">
<li>{{item}}</li>
</ng-template>
`
})
export class AppComponent {
title = 'Tour of Heroes';
heroes = ['Windstorm', 'Bombasto', 'Magneta', 'Tornado'];
}
期待任何形式的帮助。
谢谢
我之前在另一个问题上已经回答了几乎相同的问题,这可能会对你有所帮助。如果没有,请随时发表评论,我会提供帮助。
简而言之:不要为此使用管道。传递数据时在组件中过滤和排序。