☰

knockout.js は配列が空かどうかに基づいて表示ステータスを変更します 質問する

tag-icon • tag-icon knockout.js
knockout.js は配列が空かどうかに基づいて表示ステータスを変更します 質問する

配列にアイテムがある場合にのみテーブルを表示できるようにしたい。私は自分のニーズを次のように簡素化しました。jsfiddle例。

JS:

var view_model = {
    lines: ko.observableArray([
        {
        content: 'one'},
    {
        content: 'two'},
    {
        content: 'three'},
    {
        content: 'four'},
        ]),
    remove: function(data) {
        view_model.lines.remove(data);
    }
};

ko.applyBindings(view_model);

HTML:

<span data-bind="visible:lines">Lines Exist</span> 
<ul data-bind='foreach:lines'>
    <li>
        <button data-bind="click:$parent.remove">
            Remove
        </button>
        <span data-bind="text:content"></span>
    </li>
</ul>

基本的に、テーブルから行を削除できる Web アプリがあります。 の場合array.length == 0、テーブル全体を非表示にしたいです。

ベストアンサー1

これを行うにはいくつかの方法があります。以下のフィドルは、行配列にエントリがない場合にコンテナなしのバインディングを使用してテーブル全体を非表示にします。

http://jsfiddle.net/johnpapa/WLapt/4/

<span data-bind="visible:lines">Lines Exist</span> 
<!-- ko if: lines().length > 0-->
<p>Here is my table</p>
<ul data-bind='foreach:lines'>
    <li>
        <button data-bind="click:$parent.remove">
            Remove
        </button>
        <span data-bind="text:content"></span>
    </li>
</ul>
<!-- /ko -->​

おすすめ記事