0

ビューがアクティブ化されたときに (Durandal の activate() 関数で)、Breeze を使用して WebAPI からデータを取得する次の監視可能な配列があります。

var prices = ko.observableArray();

price クラスには、id、name、および price の 3 つの属性があります。

次に、次の配列があります。

var services = [{
    active: true,
    name: 'Service1',
    price: getPrice('Service1')
}, {
    active: true,
    name: 'Service2',
    price: getPrice('Service2')
}];

getPrice(name) 関数がすべきことは、パラメータとして渡された名前を持つオブジェクトを取得することです...

ビューで次のことができるようにしたい：

<div class="services">
    <ul data-bind="foreach: services">
        <li data-bind="visible: active, text: name + ' ($' + price.price + ')'"></li>
    </ul>
</div>

私は StackOverflow で多くのことを検索し、さまざまな方法でこれを実行しようとしましたが、機能させることができませんでした。ko.utils.arrayFirst()、ko.computed() を使用する必要があるかどうか、または何をすべきかわかりません..多くのアプローチを試しましたが、成功しませんでした。

4

3 に答える 3

2

誰かがこれに出くわした場合に備えて、 MrYellow からのこの回答をコメントに追加します。

results = ko.utils.arrayMap(inputs, function(item) { return new ModelFoo(item); });

オリジナル

そのデータは観察可能な配列ではなく、プロパティも観察可能ではないため、ビューで使用することはできません。

var services = ko.observableArray([{
    active: ko.observable(true),
    name: ko.observable('Service1'),
    // Option 1
    price: ko.observable(getPrice('Service1'))
}, {
    active: ko.observable(true),
    name: ko.observable('Service2'),
    // Option 2
    price: ko.computed(getPrice(name()))
}]);

これはあなたの見解でうまくいくでしょう。Breeze でこれを行おうとしている場合は、何か問題が発生していない限り、既にオブザーバブルが存在するはずです。その時点で、もう少しコードが必要になります。

価格を繰り返し処理し、サービスを次のようにしたい場合-

var services = ko.observableArray();
ko.utils.arrayForEach(prices(), function (price) {
    services.push(new service(price.active(), price.name(), price.price());
});

このようなモデルで

function service(active, name, price) {
    var self = this;
    self.active = ko.observable(active);
    self.name = ko.observable(name);
    self.price = ko.computed(getPrice(name));
}

その理由は、新しい Knockout オブジェクト (オブザーバブル) を作成する場合、Breeze の結果を繰り返し処理して作成する必要があるためです。示されているようなモデル タイプを使用すると、効率的になり、すべてを範囲内に収めることができます。

もう 1 つのオプションは、 price() に price プロパティ以外に必要なものがすべて含まれている場合、Breeze エンティティが返されたときにコンストラクター メソッドを作成して価格を計算することです。

于 2013-08-07T22:18:51.383 に答える