0

いくつかのオブザーバブル (予算、会社、コストセンター) の配列を持つビューモデルがあります。Budgets には、CostcenterID と、costcenterid に基づいて costcenterlist からその予算の costcenter を返す計算されたオブザーバブルがあります。

私の見解では、私は予算に拘束されており、私は持っています

<td>
    <select data-bind="options:$root.Costcenter,optionsCaption:'cost center', optionsText:'Title', optionsValue:'Id', value:CostCenterId "></select>                         
</td>
<td>
    <span data-bind="text:CostCenter().Company().Title"></span>
</td>

予算にコストセンターがある場合は正常に機能しますが、特定の予算にコストセンターが存在しない場合、バインドエラーが発生します

0x800a139e - Microsoft JScript ランタイム エラー: バインディングを解析できません。

メッセージ: TypeError: オブジェクトはこのプロパティまたはメソッドをサポートしていません。

バインディング値: text:CostCenter().Company().Title

(costCenterID に基づいて costcenter が見つからない場合、costCenter の計算されたオブザーバブルは空のオブジェクト {} を返します)。

オブジェクトが空かどうかを確認する一連の if ステートメントでバインディングを散らかさずにこれを処理する最善の方法は何ですか?

4

3 に答える 3

6

簡単な解決策は、withバインディングを使用してTitleスパンをラップし、CostCenter空のときに null を返すだけにすることです。

<td data-bind="with: CostCenter">
    <span data-bind="text: Company().Title"></span>
</td>

が null の場合CostCenter、内部コンテンツはレンダリングされず、存在しないプロパティ/オブザーバブルに対してバインドしようとしません。

Titleまたは、次のように具体的に表す計算されたオブザーバブルを作成することもできます<span data-bind="text: CostCenterCompanyTitle"></span>。したがって、この場合、computed は、CostCenter が定義されているかどうかを確認するためのチェックを処理します。ただし、バインドするプロパティが多数ある場合は、ビュー モデルが複雑になり、混乱する可能性があります。withバインディングを使用する方が簡単です。

于 2012-11-28T02:38:16.470 に答える
1

たとえば、costCenterに関連する機能をdiv（または同じtd）でラップして、このオブジェクトが未定義かどうかを確認することをお勧めします。

costCenterAccessible = ko.computed(
function()
{
   return self.CostCenter() != undefined;
}, this
);


<td data-bind="visible: costCenterAccessible>
    <span data-bind="text:CostCenter().Company().Title"></span>
</td>

ただし、すべてのフィールドにアクセスできるわけではない場合は、このタスクにテーブルを使用するのが良い解決策であると考え直す必要があります。

于 2012-11-27T22:16:49.777 に答える