javascript 什么是 AngularJS 中的有状态过滤？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25877704/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What is stateful filtering in AngularJS?
提问by alamoot
I was reading the AngularJS developer guide on the Filter section (https://docs.angularjs.org/guide/filter#stateful-filters) and came across "Stateful Filters".
我正在阅读过滤器部分 ( https://docs.angularjs.org/guide/filter#stateful-filters)上的 AngularJS 开发人员指南，并遇到了“有状态过滤器”。
This description is given as follows:
说明如下：
It is strongly discouraged to write filters that are stateful, because the execution of those can't be optimized by Angular, which often leads to performance issues. Many stateful filters can be converted into stateless filters just by exposing the hidden state as a model and turning it into an argument for the filter.
强烈建议不要编写有状态的过滤器，因为 Angular 无法优化这些过滤器的执行，这通常会导致性能问题。许多有状态过滤器可以转换为无状态过滤器，只需将隐藏状态作为模型公开并将其转换为过滤器的参数即可。
I'm new to web development, so have no idea what Stateful filtering is, and Angular Documentation didn't explain it either :( Can someone please explain what is the difference between a normal filter and a stateful filter is?
我是 Web 开发的新手，所以不知道什么是有状态过滤，Angular 文档也没有解释它:( 有人可以解释一下普通过滤器和有状态过滤器之间的区别是什么吗？
回答by m59
"State" is referring to variables/properties/etc that are set throughout the application. These values have the potential to change at any given time. The docs are saying that the filter shouldn't depend on external "state". Anything the filter needs to know about should be passed in as an argument when filtering, and the filter should then have everything it needs to do the filtering and return the result Look over the demo in the docs and you'll see that in the "stateful" filter, the filter has a dependency on a service which it uses to do the filtering. That service value could change during a $digestcycle, so the $statefulproperty has to be set on the filter so that Angular will run the filter again to be sure that dependency hasn't changed state, this changing the filter's result.
“状态”是指在整个应用程序中设置的变量/属性/等。这些值有可能在任何给定时间发生变化。文档说过滤器不应该依赖于外部“状态”。过滤器需要知道的任何信息都应该在过滤时作为参数传入，然后过滤器应该拥有执行过滤所需的一切并返回结果查看文档中的演示，您将在“ stateful”过滤器，过滤器依赖于它用来进行过滤的服务。该服务值可能会在一个$digest周期内发生变化，因此$stateful必须在过滤器上设置该属性，以便Angular 再次运行过滤器以确保依赖项没有改变状态，这会改变过滤器的结果。
So, all "state" should be in the arguments, like this:
因此，所有“状态”都应该在参数中，如下所示：
<p>{{myData | multiplyBy:multiplier}}</p>
With a filter like:
使用过滤器，如：
.filter('multiplyBy', function() {
function filter(input, multiplier) {
return input * multiplier;
}
return filter;
})
If the data or arguments change, the filter will run again.
如果数据或参数发生变化，过滤器将再次运行。
The statefulversion would be something like this (not recommended!):
该stateful版本将是这样的（不推荐！）：
<p>{{myData | myFilter}}</p>
And the filter gets it's needed information from external sources:
过滤器从外部来源获取所需的信息：
.filter('myFilter', ['someDependency', function(someDependency) {
function filter(input) {
// let's just say `someDependency = {multiplier: 3}`
return input * someDependency.multiplier;
}
filter.$stateful = true;
return filter;
}])
In that sample filter, someDependency.multipliershould have been passed in as an argument to the filter (as in the first example), rather than being a dependency of the filter.
在该示例过滤器中，someDependency.multiplier应该作为参数传入过滤器（如第一个示例中），而不是作为过滤器的依赖项。
To further clarify the problem: If you called a function like this: foo(20)and get a result of 40, you should get the same result if you repeat the process. If you called foo(20)again and got 92, that would be rather confusing, right? Assuming fooisn't a function that is made to return random values, the only way it could return different numbers each time is if it performs differently based on a hidden state (something changing internally, rather than being passed in as an argument). The idea that the function would return the same each time given the same arguments is called being "idempotent".
进一步澄清问题：如果您调用这样的函数：foo(20)并得到 的结果40，如果重复该过程，您应该得到相同的结果。如果你foo(20)再次调用并得到92，那会相当混乱，对吧？假设foo不是一个返回随机值的函数，它每次返回不同数字的唯一方法是它是否基于隐藏状态执行不同的操作（内部发生变化，而不是作为参数传入）。函数每次给定相同的参数都会返回相同的想法被称为“幂等”。
Note: $statefulseems to be new in Angular 1.3
注意：$stateful似乎是 Angular 1.3 中的新内容
