Что такое нечистая труба в Angular?

@Pipe({name:'myPipe', pure: false})

Я не могу понять грязные трубы, некоторые из них лучше с чистыми трубами.

Пожалуйста, объясните мне простой и простой пример?

Ответы

Ответ 1

Чистый канал вызывается только тогда, когда Angular обнаруживает изменение значения или параметров, переданных в канал. Нечистая труба вызывается для каждого цикла обнаружения изменений, независимо от того, изменяются ли значение или параметры.

Это относится к изменениям, которые не обнаружены Angular

  • когда вы передаете массив или объект, который изменил содержимое (но все еще тот же экземпляр)
  • когда канал вводит сервис для получения доступа к другим значениям, Angular не распознает, изменились ли они.

В этих случаях вы, вероятно, все еще хотите, чтобы труба была выполнена.

Вы должны знать, что нечистые трубы склонны быть неэффективными. Например, когда массив передается в канал для фильтрации, сортировки,..., тогда эту работу можно выполнять каждый раз, когда запускается обнаружение изменений (что довольно часто, особенно при настройке ChangeDetectionStrategy по умолчанию), хотя массив, возможно, даже не изменился, Ваш канал должен попытаться распознать это и, например, вернуть кэшированные результаты.

Ответ 2

Помимо предыдущего ответа, я хочу добавить еще одно отличие: количество экземпляров.

Предположим, что в HTML-коде используется несколько раз подряд. Как:

<p> {{'Hello' | translate }}<p>
<p> {{'World' | translate }}<p>
  • Если труба чиста: будет только один экземпляр трубы. Метод преобразования будет вызываться дважды, но в том же экземпляре.
  • Если труба нечистая: будут два экземпляра трубы.

(вы можете видеть это, создавая случайный идентификатор в конструкторе канала и печатайте его в обоих методах: constructor и transform)

Поскольку чистые трубы (или вообще чистые функции) имеют (должны) не иметь ЛЮБЫХ побочных эффектов, один и тот же чистый код можно повторно использовать сколько угодно раз, не беспокоясь. Похоже, поэтому чистые трубы создаются только один раз.

OBS: это действительно в моей среде angular 4.0.

Ответ 3

Демонстрация: разница ч/б чистой и нечистой pipes

В angular pipe может использоваться как pure и impure

Что такое чистая или нечистая pipe?

Проще говоря,
impure-pipe работает для каждого изменения в component
pure-pipe работает только при загрузке component.

Как сделать pipeу чистой или нечистой?

@Pipe({
  name: 'sort',
  pure: false //true makes it pure and false makes it impure
})
export class myPipe implements PipeTransform {

  transform(value: any, args?: any): any {
     //your logic here and return the result
  }

}

Как это использовать?

<div> {{ arrayOfElements | sort }}<div>

Будьте осторожны при использовании нечистого канала, поскольку это может привести к чрезмерному использованию системных ресурсов в случае нецелевого использования.

Читайте подробно на Чистой и Нечистой Трубе

Ответ 4

Чистые и нечистые трубы

  • Чистые каналы - это каналы, которые выполняются только при обнаружении "ЧИСТОГО ИЗМЕНЕНИЯ" для входного значения.

    • Чистое изменение - это либо изменение входного значения (строка, число и т.д.). или измененная ссылка на объект.
  • по умолчанию труба - это чистая труба.

  • Таким образом, нечистый канал запускается каждый раз, независимо от того, изменился источник или нет. что приводит к плохой производительности. вот почему не рекомендуется использовать каналы для фильтрации данных.

Чтобы сделать трубу нечистой:

  name: 'empFilter',
  pure: false  // default is set to true.
})
export class EmpFilterPipe implements PipeTransform {

  transform(employees: Employee[], searchValue?: string): Employee[] {

   }
}
<input type="text" [(ngModel)]="searchValue">
<button (click)="changeData()"></button>

changeData(): void{
    this.employees[0].name = "SOMETHING ELSE";
}

<div *ngFor="let emp of employees | empFilter : searchValue">
    {{emp.name}}
</div> 
NOTE : if pipe is pure and  employees data is changed using method "changeData()" - It will not detect the changes .
     Since input value to the  EmpFilterPipe is Object & reference of "employees"  has not been changed.