Angular 2将管道值存储在变量中答案

【问题标题】：Angular 2 store piped value in variableAngular 2将管道值存储在变量中
【发布时间】：2017-02-16 11:31:13
【问题描述】：

我有一个名为 search 的管道，我想将返回的管道值存储在这样的变量中（在我的模板中）

let searchedItems = items | search

有什么想法吗？

【问题讨论】：

标签： angular typescript angular2-template angular2-forms

【解决方案1】：

假设您在一个组件中，您可以实例化一个新管道并内联应用它的转换，如下所示：

let searchedItems = new SearchPipe().transform(items);

另外，你可以利用Angular2的注入系统：

import { SearchPipe} from './pipes';

class SearchService {

    constructor(private searchPipe: SearchPipe) {

    }

    public searchItems(items: any[]): any[]{
        let searchedItems = this.searchPipe.transform(items);

        return searchedItems;
    }
}

【讨论】：

【解决方案2】：

存储在模板中：

<input hidden #searchItems="ngModel" [ngModel]="items | search" />
<!--assuming you want to reuse it inside ngFor-->
<li *ngFor="let item of searchItems.value">
 {{item.Name}}
</li>

【讨论】：

【解决方案3】：

是的，我遇到了类似的问题，但我能够通过创建 NotificationPipe 来解决它。 NotificationPipe 然后使用观察者将数据推送出去。

这里是 NotificationPipe`：

import { Pipe, PipeTransform } from '@angular/core'
import { MessageService } from '../../../services'
import { Issue, Action } from '../../../model/issue/issue'

@Pipe({ name: 'issueNotification' })
export class IssueNotificationPipe implements PipeTransform {

    constructor(private messageService: MessageService, ) {

    }
    transform(issues: Issue[]): Issue[] {
        this.messageService.sendMessage({ 'action': Action.BOOKMARKS_FILTERED, 'msg': issues })
        return issues
    }
}

MessageService 只是一个抽象观察者的服务包装器

【讨论】：