angular-pipe 相关问题

这是app.module.ts 从'@angular/core'导入{NgModule}；从 '@angular/platform-browser' 导入 { BrowserModule } ；从 '@angular/common/http' 导入 { HttpClient, HttpClientModule }; 重要...

angular angular-pipe ngx-translate

回答 3 投票 0

角度动态管道

我正在尝试构建动态管道，尽管我已将管道包含在应用程序模块提供程序中，但它引发了 NullInjector 错误。我建议打开

angular dynamic angular-pipe

回答 1 投票 0

如何测试具有自身依赖项的 Angular 管道（使用 NG 15 inject() 注入）？

一个最小的工作示例，在一个新的 Angular 15 CLI 应用程序中：一个（空白）服务 HelperService 此服务通过新的 inject() 调用注入到 DemoPipe 中：导出类 DemoPipe 实现

angular testing dependency-injection karma-runner angular-pipe

回答 1 投票 0

Angular2 在自定义管道中使用基本管道

我想为基本的 angular2 管道添加一些额外的功能。 IE。在货币管道上完成一些额外的格式化。为此，我想在组件代码中使用现有管道...

angular angular-pipe

回答 4 投票 0

如何仅在值变化时调用管道

我正在使用 angular 2 和 primeng p-dropdown，并且有一种情况，当用户选择父级时，我需要过滤子级下拉列表。我使用像这样的自定义管道来做到这一点我正在使用 angular 2 和 primeng p-dropdown，并且有一种情况，当用户选择父级时，我需要过滤子级下拉列表。我使用像这样的自定义管道来做到这一点 <p-dropdown [options]="carTypesOptions" [(ngModel)]="CarTypeId" name="CarTypeId"></p-dropdown> <p-dropdown [options]="carMakeOptions | filterCarMakes: CarTypeId" [(ngModel)]="CarMakeId" name="CarMakeId"></p-dropdown> 所以当用户选择汽车类型时，我使用 filterCarMakes 管道过滤第二个下拉列表，该管道采用 CarTypeId（父选择的 ID）。一切都很好。这是我的filterCarMakes烟斗。 @Pipe({ name: 'filterCarMakes', pure: false }) export class FilterMakesPipe implements PipeTransform { transform(carMakesOptions: CarMakeSelectItem[], carTypeId: string): CarMakeSelectItem[] { if (!carTypeId) return carMakesOptions.filter(p => p.carTypeId == null); //perform some filtering operation return filteredCarMakeOptions; } } 问题是如果我在管道中放置一个 console.log，它会继续非常快速地在控制台上记录该消息（比如每 100 毫秒一次）这意味着即使 parent 的值没有改变它也会继续调用。这样做的副作用是，如果有滚动，我无法在子下拉列表中选择任何值，因为它会继续刷新选项。过滤下拉列表的简单截图如下（它不会让我滚动选择其他值并会继续刷新） P.S：我不想在 onChange 事件中做它并从组件调用管道，所以可以在模板中做吗？发生这种情况是因为管道不纯净纯管道：Angular 仅在检测到输入值发生纯变化时才执行纯管道。纯更改是对原始输入值（字符串、数字、布尔值、符号）的更改或更改的对象引用（日期、数组、函数、对象）。不纯管道：Angular 在每个组件更改检测周期中执行不纯管道。不纯的管道经常被调用，就像每次击键或鼠标移动一样频繁。来源：https://angular.io/guide/pipes 但是如果您出于任何原因确实需要管道不纯，出于性能考虑，您需要将组件更改检测策略设置为OnPush，并在应用更改时手动触发更改检测。 import { Component, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; @Component({ selector: 'awesome-component', templateUrl: './pda.html', changeDetection: ChangeDetectionStrategy.OnPush }) export class AwesomeComponent implements OnInit { constructor( private cd: ChangeDetectorRef, ) { } ... fetchData() { ... // after any data change this.cd.markForCheck(); ... } ... }

angular primeng angular-pipe

回答 1 投票 0

angular-pipe 相关问题

最新问题