我如何在Angular 2中的管道和組件之間進行通信

Question

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

我有一個管道，我想在其中使用變量。 在我的組件中定義了相同的變量。 如何將該值從Component傳遞到Pipe？

//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傳遞到Pipe的newVal中。

// HTML模板

Answer 1

您可以使用模板中的管道並將新值傳遞給它。

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

或者，由於Pipe只是Javascript類，因此您可以將其導入組件中並使用它。

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

但我不建議稍后。

如果要以編程方式使用管道，請考慮將轉換邏輯拆分為服務，然后在pipe和component導入並使用該服務。