angular-pipe 相关问题

用于讨论Angular 2+管道

我正在使用 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

注入自定义管道进行单元测试

我已经扩展了DecimalPipe，并使用了这种方式，对于单元测试来说，它是失败的。我也在TestBed中注册了管道。`NullInjectorError: R3InjectorError(DynamicTestModule)[...

angular angular-pipe angular-test

回答 1 投票 0

如何从HttpClientInMemoryWebApiModule angular中排除一个服务？

我已经在我的angular应用中配置了HttpClientInMemoryWebApiModule。我想排除一个服务，这样我就可以在不添加基础网址的情况下测试它。问题：app.module.ts : ...

angular httpclient angular-services angular-pipe angular-in-memory-web-api

回答 1 投票 1

property 'blueprint' -> object with constructor 'LViewBlueprint' --- index 1 closes the circle

https: 将圆形结构转换为JSON

json angular angular-pipe

回答 1 投票 0

为什么自定义管道会出现错误。EllipsisPipe "类型中的属性 "transform "不能分配给基本类型 "SlicePipe "中的相同属性。

我在stackoverflow上参考了别人的回答，创建了一个自定义管道。如果article.title大于55个字符，那么在55个字符之后应该被修剪，三个点应该......。

angular typescript angular-pipe

回答 1 投票 0

async管道发送'null'值到子组件。

我想传递一个值给子组件。这个值是一个Observable，所以我使用async管道。 test$只是一个普通的observable变量，它......

angular rxjs observable angular-pipe async-pipe

回答 1 投票 0

在Angular 8中，在同一个文件中定义自定义管道时出错。

我有一个ts文件，其中我声明了几个管道，如图所示： import { Pipe, PipeTransform } from '@angularcore'; import * as moment from 'moment'; @Pipe({ name: 'round' }) export class ....

angular angular-pipe

回答 1 投票 0

lowercase}}

如果我这样做。

angular angular-pipe

回答 2 投票 0

使用bypassSecurityTrustHtml管道时获取子元素的ID onClick

[如何从父元素上单击来捕获子元素的ID？我有一个视图，该视图使用管道将主题标签和@提及转换为粗体的彩色文本。此转换是在...

angular angular-pipe

回答 1 投票 0

在离子5组件内部未发现货币管道错误

我正在页面模块内部使用货币管道，没有任何问题。但是，在模态组件中使用它时，会显示“未找到错误”。用法示例：{{50 |货币：“ INR”}}错误：...