2

ノックアウト foreach を使用してネストされた配列をバインドする際に支援が必要です。

以下はコードです。PatAppointments 配列内にある要素を取得する方法を知りたいです。

 <script language="javascript" type="text/javascript">
 ko.applyBindings({
    "appointment": [{
        "Date": "01\/10\/2012",
        "PatAppointments": [{
            "EndTime": "11:15:00",
            "EventId": null,
            "Facility": "General Physician",
            "PatientID": 23,
            "PatientName": "Vicki"
        }],
        "PatAppointments": [{
            "EndTime": "11:15:00",
            "EventId": null,
            "Facility": "General Physician",
            "PatientID": 23,
            "PatientName": "Scott"
        }]
    }]
});

</script>

<table>
<tbody data-bind="foreach: appointment">
<tr>
    <td data-bind="text: Date">
    </td>
</tr>
<tr>
    <td>
         @*
        <tbody data-bind="foreach: appointment.PatAppointments">
        <tr>
            <td data-bind="text: PatAppointments.PatientName">
            </td>
            <td data-bind="text: PatAppointments.Facility">
            </td>
        </tr>
        </tbody>
        *@
    </td>
</tr>
</tbody>
</table>
4

3 に答える 3

4

現在セットアップしているため、foreachは機能しません。PatAppointments を正しく設定するには、オブジェクトは次のようになります。

"appointment": [{
    "Date": "01\/10\/2012",
    "PatAppointments": [
    {
        "EndTime": "11:15:00",
        "EventId": null,
        "Facility": "General Physician",
        "PatientID": 23,
        "PatientName": "Vicki"
    },
    {
        "EndTime": "11:15:00",
        "EventId": null,
        "Facility": "General Physician",
        "PatientID": 23,
        "PatientName": "Scott"
    }]
}]

そして、gbsが述べているように、foreach別のバインディング内にバインディングが必要になるでしょうforeach:

<div data-bind="foreach: appointment">
    <div data-bind="foreach: PatAppointments">
        //Everything you want displayed from each PatAppointment here.
    </div>
</div>

小さな例については、フィドルを参照してください。

于 2012-10-03T13:35:44.963 に答える
3

foreach構文をバインドするためだけに要素を作成するのが難しい/役に立たない、ネストされた配列を使用しています。次のような「コンテナレス制御フロー構文」が好きです。

<!-- ko foreach: appointment -->
    <!-- ko foreach: PatAppointments -->
        <span data-bind="text: PatientName"></span>
    <!-- /ko -->
<!-- /ko -->

「注4」の下にあるドキュメントを参照してください http://knockoutjs.com/documentation/foreach-binding.html

于 2014-04-12T16:00:31.647 に答える
2

1 つの配列が別の配列にネストされているため、次の例のように、2 つのネストされた html 要素 (div、ul、tr、...) で 2つのforeachバインディングを定義する必要があります。

<div data-bind="foreach: appointment">
    <div data-bind="foreach: PatAppointments">
        <span data-bind="text: PatientName"></span>
    </div>
</div>
于 2012-10-03T10:30:02.897 に答える