* ng用于管道输出过滤

时间:2016-08-25 14:28:50

标签: angular

我有一个HTML结构,如:

<div *ngFor="#notification of notifications"
      [innerHTML]="notification | notificationHTML">
</div>

notificationHTML管道:

transform(notification: string, args: any[]): any {
var example: any;
this._service.GetExample(notification)
     .subscribe(e => {
         example = e;
      });
return "<span>" + example + "</span>";
}

问题是example变量等于undefined,因为函数GetExample没有时间按时执行。我该如何解决这个问题?

2 个答案:

答案 0 :(得分:1)

您可以尝试以下,

Pipe转换中返回一个Observable,然后使用async pipe

组件模板

 <div *ngFor="#notification of notifications"
   [innerHTML]="notification | notificationHTML | async">
 </div>

<强>管

  notificationObservable: Subject<any> = new Subject<any>();

  transform(notification: string, args: any[]): any {
   this._service.GetExample(notification)
      .subscribe(e => {
         this.notificationObservable.next("<span>" + e+ "</span>");
     });
   return notificationObservable;
  }

以下是Plunker!!

希望这会有所帮助!!

答案 1 :(得分:0)

我假设GetExample返回某种可观察量。如果是这样,则无法保证在transform返回之前触发您的订阅。您必须使GetExample方法同步,或者您必须缓存订阅返回的值,并在调用transform时使用它。