0

私はこのようなテンプレートを持っています:

<tbody id="departureTemplate" data-win-control="WinJS.Binding.Template">
<tr >
    <td>
        <span data-win-bind="innerText: timezone_scheduled_departure_time "></span> <span class="small" data-win-bind="innerText: flights_joined"></span>
    </td>

    <td>
        <span data-win-bind="innerText: destination_joined"></span> <span class="small" data-win-bind="innerText: airline_names_joined"></span>
    </td>

    <td>
        <span data-win-bind="innerText: remarkstr"></span> Värav <span class="small" data-win-bind="innerText: gate"></span>
    </td>
</tr>
</tbody>

そして、次のようなコード：

var departureData = JSON.parse(response.responseText);
var departureBinding = new WinJS.Binding.List(departureData);

var tableBody = document.getElementById("departureTemplate");
var template = document.getElementById("departureTemplate").winControl;

var showItems = 4;
var currentItems = 0;

departureBinding.forEach(function (item) {
    if (currentItems < showItems) {
        template.render(item, tableBody);
    }

    currentItems++;
});

しかし、私の問題は、レンダリングされた最初の TR にデータがないことです。他のものは問題なくレンダリングされます。template.render に送信する前にデータをログアウトすると、必要な値がすべて含まれます。

この動作の原因は何ですか？

4

2 に答える 2

0

このシナリオでは、理論的には問題ありません（ある程度）。テンプレートを個別に定義します。テンプレートテーブルは実際には次のようになります。テンプレートテーブルはレンダリングされたエンティティとは別になります。そうしないと、テンプレートに直接レンダリングしている場合にテンプレートが実際に破棄され、最初の行が表示されなくなる可能性があります。テンプレートデータに取り込まれるように。

これをテーブルの下に追加するだけです。

<table>
    <tbody id="airlineData"></tbody>
</table>

新しいテーブルを指すようにテーブル本体を変更します。

var tableBody = document.getElementById("airlineData");

それがあなたのために働くかどうか私に知らせてください。

于 2013-03-08T21:06:30.313 に答える
0

バインディング テンプレート (WinJS.Binding.Template コントロール) は、ListView および FlipView コントロールで使用するように設計されています。

テンプレートを使用してデータをバインドする方法 (JavaScript と HTML を使用した Windows ストア アプリ)のトピックを確認することをお勧めします。

ListView といくつかの CSS スタイルを使用すると、table 要素を使用した場合と同じ外観を、より少ないコードでより柔軟に実現できるはずです。

それが役立つことを願っています。

Windows ストア アプリ開発の詳細については、App Builderに登録してください。

于 2013-03-08T19:50:19.303 に答える