过滤器的Angularjs繁忙指示器

我有手机可能需要2或3秒的过滤器。我想在显示屏上“忙”显示，直到Angular完成它的任务（过滤并重新绘制需要的内容），这样用户不会再次点击。

是否有一个我可以订阅的事件会帮助我将它连接起来？

2013-10-22 Pablo

您应该意识到angularjs中的过滤器应该很短，因为angular会经常调用它们。看看这个简单的例子http://jsfiddle.net/mchrobok/eappK/1/。在控制台中，您可以看到过滤器被调用的次数。在每个$摘要中都会使用角度调用过滤器，因此即使您单击按钮也会调用它们。我认为它会挂起你的应用程序，如果你的过滤器执行2秒。 – mchrobok

我还用我的解决方案准备了另一个jsfiddle：http://jsfiddle.net/mchrobok/8Xq4d/7/。不幸的是，除非在掩码被隐藏之前设置断点，否则掩码不可见。我不知道为什么，因为控制台中的日志是正确的 - 消息“显示/隐藏掩码”显示正确。 – mchrobok

我的应用程序运行良好。它可能不是我的过滤器，但Angular需要时间来重新显示更新的内容。我只是想要一种“忙碌”显示的方法。我最初是通过从服务器获取更新（很多繁忙的指标）。当角度可以在本地执行时，看起来像浪费。 – Pablo

是否有您需要事件的特定原因？我不认为有一个，但你可以考虑把所有的过滤函数都包装在一个通用的繁忙指标包装器中。

function busyWrap(func) { 
    return function() { 
    Busy.start(); 
    try { 
     func.apply(this, Array.prototype.slice.call(arguments, 0)); 
    } finally { 
     Busy.stop(); 
    } 
    } 
};

在你的过滤器定义

然后改变这样的事情

app.filter('filter', function() { 
    return function(input) { 
    return output; 
    }; 
});

这个

app.filter('filter', function() { 
    return busyWrap(function(input) { 
    return output; 
    }); 
});

的代码可能不是完美的，但一个可重复使用的功能，将包过滤功能的想法是你最好的选择。尽管如此，代码占用时间最长的代码很可能是角度内部的（例如在排序列表中重新绘制大的ng-repeat），所以这可能无法帮助你。

来源

2013-10-22 20:53:11 Adam

我尝试了一些类似的东西（不够高雅），但它没有完成这项工作。我会更新这个问题，以便“做它的事情”更加明确。 – Pablo

我写一个指令BusyIndicator控件IsBusy =“IsBusySubmitting || IsBusyLoadingTemplate”

我还可以控制通过控制器范围这样的繁忙指示符层。

https://twitter.com/leblancmeneses/statuses/341368016556142594

来源

2013-10-23 11:14:16

BusyIndicator本身不是我的问题（有很多例子可用）。我的问题是如何通过处理我的过滤器时角度去激活它。 – Pablo

知道何时停用某些东西 - 您需要使用promise API。我的busyindicator的逻辑驻留在控制器中。 –

过滤器的Angularjs繁忙指示器

回答

相关问题