Question

我正在使用Breeze，它自动创建一个嵌套的Observablearray结构，该结构由不同级别的相关可观察对象组成。

我试图模仿这个小提琴中的结构。简单地说，我有一个客户端实体从服务器返回，其中一个相关的用户实体，Breeze自动映射到一个可观察的数组。我只需要从这个数组中在我的表单上显示一些客户端属性和一些用户属性。

HTML

<div>

    <select  data-bind="options: clientAndStaff, optionsText: 'clientId', value: 'clientId', optionsCaption: 'Select a client'"></select>    

</div>

VM

var esp= esp||{};

esp.ClientDetails  = function(x){

    this.clientId =  new ko.dependentObservable(function(){return x.clientId;});

   this.User =  new ko.dependentObservable(function(){return x.ClientStaffDetails;});


};


esp.ClientStaffDetails = function(x){

    var FirstName = new ko.dependentObservable(function(){return x.firstName;});
    var LastName =  new ko.dependentObservable(function(){return x.lastName;});


};

esp.vm = new (function()
              {
                  this.clientAndStaff= ko.observableArray(
                  [
                      new esp.ClientDetails({clientId:1                                        
                                             ,clientStaff:new esp.ClientStaffDetails({firstName:'first',lastName:'example'})

                                            }),
                      new esp.ClientDetails({clientId:2
                                             ,clientStaff:new esp.ClientStaffDetails({firstName:'second',lastName:'example'})
                                            })   

                  ]
                  );
              });

ko.applyBindings(esp.vm);

小提琴

http://jsfiddle.net/T6Fk5/7/

任何人都可以告诉我如何在给定observableArray结构的情况下将optionsText绑定到firstName或更好的firstName + LastName。提前致谢

Answer 1

最简单的方法是覆盖clientStaffDetails类的toString方法。

esp.ClientStaffDetails = function (x) {
    var self = this;

    self.FirstName = new ko.observable(x.firstName);
    self.LastName = new ko.observable(x.lastName);
    self.toString = ko.computed(function () {
        return self.FirstName() + ' ' + self.LastName();
    });

};

我还将optionsText参数更改为User

<div>
    <select data-bind="options: clientAndStaff, optionsText: 'User', value: 'clientId', optionsCaption: 'Select a client'"></select>
</div>

请参阅Fiddle

我希望它有所帮助。

Answer 2

我能做到的唯一方法是重新构建breeze返回的数据，然后将其添加到我的可观察数组中。对此不是很满意，但由于只读数据现在可以使用。

function querySucceeded(data) {
            if (observableArray!= null) {
                var temp = [];
                data.results.forEach(function (val) {
                    temp.push({'id':val.ClientStaffID(),'name':val.User().FirstName() +' '+val.User().LastName() });

                });
                observableArray(temp);
                firstLoad = false;
                return;
            }

        }

在knockout中绑定嵌套的依赖observable的Observable数组

2 个答案: