3

テンプレートが読み込まれるのを待たずに、ブラウザにすぐにアクセスできるようにしたいと思います。現在、これは、大きな配列（この場合は1000個の要素）を提供している場合には当てはまりません。外部テンプレートエンジンを使用してみましたが、テンプレートに「読み込み中...」と表示され、読み込みが完了するまでブラウザが応答しません。

説明のために、簡単な例：

JS：

function User(firstname, lastname) {
    this.firstname = ko.observable(firstname);
    this.lastname = ko.observable(lastname);
}

function UserViewModel() {
    this.allUsers = ko.observableArray([
        new User("John", "Doe"),
        new User("John", "Doe"),
        new User("John", "Doe"),
        // 1000 elements ...
        new User("John", "Doe")
    ]);
}

ko.applyBindings(new UserViewModel());

HTML：

<html>
    <head>
    ...
    </head>

    <body>

        <ul data-bind="template: { name: 'my-template', foreach: allUsers() }"></ul>

        <script type="text/html" id="my-template">
            <li>
                <h1 data-bind="text: firstname()"></h1>
                <h2 data-bind="text: lastname()"></h2>
            </li>
        </script>

    </body>
</html>

つまり、基本的に私が望んでいるのは、テンプレートがレンダリングされているときにブラウザにアクセスできるようにすることです。テンプレートの準備ができたらすぐに視覚化する必要があります。前述の外部テンプレートエンジンは私のニーズを満たしていません。

4

1 に答える 1