breeze - 如何在 Breeze 中创建“加载”微调器？

Question

我正在尝试创建一个加载微调器，当微风与服务器通信时将显示该微调器。Breeze 中是否有某些属性仅在 Breeze 向服务器发送数据、接收数据或等待响应（例如，在进行异步调用但还没有响应之后）时才为“真”？我想将这些数据绑定到一个淘汰赛 observable 并将 spinner 绑定到这个 observable，

谢谢，

埃利尔

Answer 1

使用 spin.js

http://fgnass.github.io/spin.js/

它是如此简单..在执行查询之前使其可见，并在查询成功或失败后禁用它。

Answer 2

在 Breeze 查询时，我看不到任何设置或可观察的属性，但如果您使用数据上下文或某些 JavaScript 模块进行数据调用，这就是您可以做的 -

编辑

考虑到 John 的评论，我添加了一种标记方式来跟踪每个查询。

    var activeQueries = ko.observableArray();

    var isQuerying = ko.computed(function () {
        return activeQueries().length !== 0;
    });

    var toggleQuery = function (token) {
        if (activeQueries.indexOf(token) === -1)
        { activeQueries.push(token); }
        else { activeQueries.remove(token); }
    };

    var getProducts = function (productsObservable, forceRemote) {
        // Don't toggle if you aren't getting it remotely since this is synchronous
        if (!forceRemote) {
            var p = getLocal('Products', 'Product','product_id'); 
            if (p.length > 0) {
                productsObservable(p);
                return Q.resolve(); 
            }
        }

        // Create a token and toggle it
        var token = 'products' + new Date().getTime();
        toggleQuery(token);

        var query = breeze.EntityQuery
            .from("Products");

        return manager.executeQuery(query).then(querySucceeded).fail(queryFailed);

        function querySucceeded(data) {
            var s = data.results;
            log('Retrieved [Products] from remote data source', s, true);
            // Toggle it off
            toggleQuery(token);
            return productsObservable(s);
        }
    };

您将需要确保所有失败逻辑也切换查询。

然后在您想要放置微调器的视图中

var spinnerState = ko.computed(function () {
    datacontext.isQuerying();
};