angular - 如何在 Angular 2 中的管道和组件之间进行通信

Question

 <tr *ngFor="let logDetails of logDetails | search : term" >

我有一个要在其中使用变量的管道。在我的组件中定义了相同的变量。如何将此值从组件传递到管道？

//Pipe Structure

transform(value, [term], newVal) {
  if (value == undefined && newVal == undefined) {
    return undefined;
  } else {
    return value.filter((item) => item.LogString.startsWith(term));
  }
}

//Component Structure

newVal(a) {
  this.newChildData = a;
  console.log(this.newChildData);
}

我想将newChildData组件传递到newVal管道中。

// HTML 模板

Answer 1

要么您使用模板中的管道并将新值传递给它。

<div>{{ yourValue | yourPipe: newChildData }}<div>

或者，由于 Pipe 只是一个 Javascript 类，您可以将它导入到您的组件中并使用它。

const pipe = new youPipe();
const result = pipe.transform(yourValue, newChildData);

但我不会建议后者。

如果您想以编程方式使用管道，请考虑将转换逻辑拆分为服务，然后在pipe和中导入并使用该服务component。