如何从 Breeze 查询返回的实体自动扩展 Knockout observables？答案

【问题标题】：How do I automate extending Knockout observables from entities returned by Breeze query?如何从 Breeze 查询返回的实体自动扩展 Knockout observables？
【发布时间】：2013-05-20 08:33:56
【问题描述】：

我正在使用 Konckout、Breeze JS、Durandal JS、ASP.NET Web API，但我的问题是针对 Breeze 和 Knockout。

如何从 Breeze 查询返回的实体自动扩展 Knockout observable？

我有一个通过 Breeze 返回的客户列表，他们有数据库特定字段，我想让这些字段看起来像样。我特别想要：

UTC 时间戳（例如“2011-07-02 13:20:13.8061582 +00:00”）显示为本地日期和时间（例如“2011 年 7 月 2 日下午 1:20”）
要格式化为货币格式的小数（例如“2500.12”）（例如“$2500.12”）
根据状态添加特定的css类（例如是Status="Available"，添加cssStatus="item-available"）

根据我阅读的内容（如果我错了请告诉我），这样做的方法是不再使用自定义绑定，而是使用 .extend() 函数扩展 KO observables。

我的 dataservice.js 具有以下 Breeze 查询，该查询接受 observable 并将其设置为数据结果。

// -- snip --
        function getCustomers(koCustomers) {
            var query = breeze.EntityQuery
                .from('Customers');

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

            function querySucceeded(data) {
                koCustomers([]);
                koCustomers(data.results);
            }
        }
// -- snip --

这里也是我的viewmdel供参考

define(['durandal/app',
        'durandal/system',
        'durandal/plugins/router',
        'services/config',
        'services/logger',
        'services/datacontext'],
    function (app, system, router, config, logger, datacontext) {
        'use strict';
    var customers = ko.observableArray();

    var viewModel = {
        title: 'Vehicles',
        activate: activate,
        customers: customers
    };
    return viewModel;

    function activate() {
        return datacontext.getCustomers(customers);
    }
});

我在想我需要某种可以接受 observable 和 data.results 的映射函数，然后循环遍历每个结果并展开它...... 任何例子都将不胜感激......

【问题讨论】：

另请参阅7704268 数字格式规则...几种格式化方法。至于css -
@user1168541 感谢 - 对于 css，我需要根据不同的状态（状态可以是可用、待处理、已交付等）应用不同的 css 样式，而不仅仅是 isAvailable...

标签： javascript knockout.js asp.net-web-api breeze durandal

【解决方案1】：

如果只是格式化，那么自定义绑定更简单，更易于维护。如果您需要扩展模型，那么当您从服务器获取它时，只需应用转换，以便每个实体都有您需要的东西。例如：

var entities = getEntitiesFromTheServer();

$.each(entities, function(i, entity){
    entity.formattedCurrency = ko.computed(function (){
        return '$' + entity.amount;
    });
});

这样就可以绑定了：

<span data-bind="text: formattedCurrency"></span>

【讨论】：

【解决方案2】：

push() 也可以用于扩展 observableArray

像这样：

   function getCustomers(koCustomers) {
        var query = breeze.EntityQuery
            .from('Customers');

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

        function querySucceeded(data) {
            koCustomers([]);
            var temp =ko.observable();
var p =ko.observableArray();
p(data.results).
var len= p().length();
var i;

for(i=0; i<len; i++)
{
temp(p()[i].amount())
var q=ko.computed(function(){
return {amount: '$' + temp()} ;
koCustomer().push(q);
});
}
}
}

对于日期格式，使用 dateString 的自定义绑定

链接：http://www.aaronkjackson.com/2012/04/formatting-dates-with-knockoutjs/

希望对你有帮助

【讨论】：