问题标签 [angular-pipe]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
3 回答
15638 浏览

angular - 手动触发管道更新

我创建了一个能够*ngFor与对象一起使用的管道。但是,当对象更新时,管道不会更新。我在这里找到了一个解决方案,方法是使用带有pure: false.

这个解决方案在我的用例的性能方面是不可接受的,因为它会为每次更改刷新管道(我几乎在任何地方都使用这个管道来渲染复杂的元素)。

有没有办法触发管道的手动刷新,所以它只在我想要的时候刷新?

这是一个plunker - 要查看问题,请尝试通过单击-按钮来删除名称。如果添加pure:false,您将看到它将起作用:

我想要的是在我的delName()函数中添加一些东西,以便它更新管道......

0 投票
2 回答
1709 浏览

angular - 如何在 Angular 2 中按优先级排序项目?

我正在尝试按优先级 [high, medium, low] 对会议进行排序,但我最终按字母顺序 [high, low, medium] 对它们进行排序,那么如何解决这个问题?这是文件:

排序.ts

会议.component.ts

会议.component.html

0 投票
1 回答
4605 浏览

angular - Angular 2 - 科学记数法数字的数字管道

我正在使用数字管道(数字:'1.2-2')来四舍五入小数。它适用于标准格式数字,但对于科学格式数字(指数),结果以标准格式返回。

For example if I apply the above number pipe to 1.336274995924138e+306 I expect 1.34e+306 but what I get is 1336274995924140000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000.

在 Angular JS 1.x 中也可以正常工作。

请告知我如何以与原始数字相同的符号取回结果。

0 投票
2 回答
325 浏览

angular - 自定义过滤器区分大小写

我创建了自定义管道来从数据库中过滤我的数据

有管

还有我的搜索输入

它工作正常,但我的数据库记录中有 aaa、Abb、AbbB、cCc 等。

当我在搜索输入中输入内容时,它只返回小写或大写的元素。

例如:搜索 -> aaa 返回 aaa 但不返回 AaA 和 Aaa

我应该如何改变它来实现它?

0 投票
1 回答
1689 浏览

angular - Angular:带有管道的 ngFor 中的 Array.splice

我有一个名单:names = ['test1', 'test2', 'test3']

我用一个简单的管道将它们显示在一个简单的布局中,该管道搜索包括用户输入在内的所有名称:

在名称旁边,有一个小叉可以将其从列表中删除。

问题是当我删除我之前搜索过的项目(例如 test2)时,过滤器没有实现。更改集合后是否可以刷新过滤器返回的内容?

0 投票
1 回答
998 浏览

angular - 创建一个自定义管道以过滤带有角度谓词的值

我想在 Angular 4.x 中创建一个自定义管道,该管道将谓词函数作为参数,以便从数组中过滤值。

这是我的管道代码:[Snippet #1:mypipe.ts]

以下是我在模板中使用它的方式:[Snippet #2:mycomponent.html]

但在运行时,我收到此错误:[Snippet #3]

我通过isValid()在我的组件中创建一个函数并将这个函数用作我的过滤器的参数来解决这个问题:

[片段#4:mycomponent.ts]

[片段#5:mycomponent.html]

但我不太喜欢这个选项,因为我认为它的可读性不如箭头函数(您必须切换到 component.ts 文件才能了解将在 component.html 中过滤的内容)。

有没有更好的解决方案,看起来像代码片段 #2 ?

0 投票
1 回答
25 浏览

angular - 过滤表数据的管道抛出错误

我正在尝试为具有字符串、数字和布尔值的混合值的数据集实现搜索管道。我正在尝试实现以下管道 演示,该链接适用于带有字符串的数据集,但我不断收到错误消息,即 toUpperCase() 不是函数,因为它无法遍历具有不同数据类型的数据,请建议我一个方法。我已经尝试以多种方式修改链接,但我失败了。我的数据集如下{ "pnr_id": 5037295, "uniqueId": 103739, "amount_paid": 37.2484, "name": "Sharon", "surname": "Monroe", "fullname": "Rhonda McLean", "email": "annette@puckett.mt", "amount_due": true, "amount_pending": 13.258, "user_name": "brandon@hanna.gf" }, { "pnr_id": 5037296, "uniqueId": 195415, "amount_paid": 42.7672, "name": "Don", "surname": "Goldstein", "fullname": "Christina Carroll", "email": "steve@cochran.mo", "amount_due": true, "amount_pending": 35.9709, "user_name": "renee@rogers.ao" } 谢谢你和问候

使用字符串的数据集的工作 Plunkr 链接:-- https://plnkr.co/edit/jXfqfCuJpKdw9HtL569T?p=preview

0 投票
1 回答
2187 浏览

angular - 带有 TypeScript 的 Angular 管道中的 MapToIterable

尝试在 Angular 中实现管道。在意识到 ngFor 不适用于地图之后。一些研究让我相信未来的功能将会解决这个问题,但与此同时,mapToIterable 管道就是答案。

我有以下代码:

map.keys() 给了我一个正确键的列表,但没有其他工作。

关于如何诊断为什么我的循环没有正确填充数组的任何建议?

0 投票
1 回答
8352 浏览

angular - 管道 'DatePipe' 的 InvalidPipeArgument

我需要在角度应用程序中格式化日期,所以我使用日期管道:

我从网络服务获得的日期格式如下:dd/mm/yyyy(例如:31/12/2017)。因此,当我尝试将管道应用到像 01/01/2017 这样的日期时,它可以工作,但不适用于 2017 年 12 月 31 日,出现以下错误:“InvalidPipeArgument: '31/12/2017' for pipe 'DatePipe'”

我该如何解决这个问题?

0 投票
2 回答
3337 浏览

angular - Angular2: FilterPipe : Cannot read property 'filter' of undefined

I've been trying to build a filter Pipe for my project, which filters through an array of strings. It is working, but still I'm getting an error. I wonder why that is? I would also like to ask if there is a way to make the filter more universal so I can use it for other strings.

Here is the pipe:

My HTML was just for testing, but here it goes:

I've also added an image so you can see, it's working, yet I'm getting an error. Error

EDIT: Universal search pipe: