Angularjs使用过滤器和$ http服务进行计时

VBA*_*ole 5 angularjs

当我的应用程序加载时,我注册过滤器和角度服务.但是过滤器试图在服务返回之前执行数据,因此我的项目集合在过滤器中咆哮.我有一个小提琴,但我不知道你是否可以在小提琴中使用$ http,因为它是一个外部资源.这就是我有Fiddle 对不起,它实际上没有用.它经历了很多.我认为我的问题是时机.我需要过滤器等待http响应或者不要"强制"自己.

我现在得到的错误是'items is undefined',因为这是应用过滤器的地方.在我尝试将http调用混合到一个服务之前,我确实有这个工作.但我觉得这是有角度的方式,我"只是想遵守".

当我的控制器触发时,它会调用获取数据:

eventApi.async().then(function () {
    $scope.eventCollection = eventApi.data();
});
Run Code Online (Sandbox Code Playgroud)

但在它返回之前,过滤器应用于html:

 <tr ng:repeat="event in events  | myEventFilter:ddlFilter |
       orderBy:sort.column:sort.descending">
Run Code Online (Sandbox Code Playgroud)

小提琴

Mic*_*ley 8

这是你更新的小提琴的一个分支,修复了一些错过的依赖项(eventApi没有注入控制器,$timeout没有注入到eventApi服务中).我的评论将基于以下代码:http://jsfiddle.net/BinaryMuse/zww7e/1/

这个小提琴成功地让我们看到你发布的问题:"在你的过滤器中无法读取未定义的属性'长度'.通常,过滤器应该能够默认处理空值/未定义值.我只是修改过滤器来读取这样的东西:

return function (items, eventFilterType) {
  var arrayToReturn = [];
  if (items === undefined) return arrayToReturn;
  // ...
}
Run Code Online (Sandbox Code Playgroud)

这应该照顾你的根本问题; 这个小提琴现在运行没有错误,虽然看起来不能正常工作; 据我所知,这是因为你设置$scope.eventCollection而不是控制器$scope.eventsif (live)部分.进行此更改会导致数据实际显示在视图中.

然而,你可能有兴趣在角的另一种属性:当您使用内置一个承诺$q,你可以在视图直接绑定到承诺,视图将对待它,就好像你绑定了该解决的价值的承诺.因此,例如,您可以执行以下操作:

// in the service
$timeout(function () {
  deffered.resolve(fakeEvents); // <-- resolve with the data
}, 2000);
return deffered.promise;

// in the controller
if (live) {
  $scope.events = eventApi.async();
}
Run Code Online (Sandbox Code Playgroud)

这是演示这种技术的小提琴的更新版本:http://jsfiddle.net/BinaryMuse/zww7e/2/

[更新]

正如Jeff在评论中指出的那样,Angular正在弃用自动承诺展开; 你可以在这里看到提交,但这里是消息:

fix($ parse):弃用promise forwrapping并将其作为选择加入

此提交禁用promise展开并添加$ parseProvider.unwrapPromises()getter/setter api,允许开发人员在需要时重新启用该功能.承诺展开支持将在未来从Angular中删除,此设置仅允许在过渡期间启用它.

如果启用了展开,Angular将记录关于展开promise的每个表达式的警告(为了减少噪声,每个表达式仅记录onces).要禁用此日志记录使用 $parseProvider.logPromiseWarnings(false).

以前在表达式评估期间在表达式中的任何位置发现的承诺将在未解析时评估为未定义,如果满足则评估为履行值.

这个功能并没有被证明是非常有用或受欢迎的,主要是因为模板中的数据访问(作为原始值访问)和控制器代码(作为promises访问)之间的二分法.

在大多数代码中,我们最终在控制器中手动解析承诺,或者通过路由自动解决承诺并以这种方式统一模型访问.

自动承诺展开的其他缺点:

  • 在构建组件时,通常需要接收原始承诺
  • 增加复杂性并减慢表达评估
  • 由于需要生成的代码量,表达式代码预生成没有吸引力
  • 使IDE自动完成和工具支持变得困难
  • 增加太多魔力

BREAKING CHANGE:$ parse和模板一般不再自动解包promises.此功能已被弃用,如果绝对需要,可以在过渡期间通过$parseProvider.unwrapPromises(true)api 重新启用 .

  • 难以置信的!非常感谢.角度在它起作用时很有趣,而在它没有的时候有很多胃灼热.但社区令人难以置信,每个人都非常乐于助人.我想,这本身就是框架有效的直接反映. (3认同)