0

現在、ユーザーの場所に応じて、保存/キャンセル/削除でフッターを作成しています。現在、必要のないときに [削除] ボタンを表示/レンダリングしないようにしています。三項演算子として KnockoutJS (観察可能) の変数を使用してこれを達成するにはどうすればよいですか?

現在のコードは正しく動作しませんが、とにかく以下です。

<li><a href="#" data-icon="back" data-theme="b" data-bind="click: cancelProduct">@(Global.ButtonCancel)</a></li>
<script>
    var button = "<li><a href=\"#\" data-icon=\"delete\" data-theme=\"b\" data-bind=\"click: deleteProduct\">@(Global.ButtonDelete)</a></li>";
    isEditingProduct ? button : false;
</script>
<li><a href="#" data-icon="check" data-theme="b" data-bind="click: saveProduct">@(Global.ButtonSave)</a></li>

私が取得し続けるエラーは、「isEditingProduct」が未定義であることです。インラインで（スクリプトの外側で）使用する<li data-bind="isEditingProduct" ></li>と、他のものと一緒にまっすぐに動作します。ボタンは非表示になりますが、フッターにぽっかり穴が開いてしまいます。そのため、まだ必要でない場合は、レンダリングのためにまったくロードしないことで回避しようとしています。

どんな助けでも大歓迎です。

4

3 に答える 3

1

あなたのコードを見て、私は混乱しています。

要素を非表示/非表示にするために三項が必要だと感じる理由がわかりません。

visible:バインディングを使用します。

<li data-bind="visible: isEditingProduct"></li>

isEditingProduct は、ビュー モデルのプロパティである必要があります。

于 2012-11-12T16:01:39.830 に答える
0

使用visibleまたはifバインドできます：

<li><a href="#" data-icon="back" data-theme="b" data-bind="click: cancelProduct">@(Global.ButtonCancel)</a></li>
<li><a href="#" data-icon="delete" data-theme="b" data-bind="click: deleteProduct, if: isEditingProduct">@(Global.ButtonDelete)</a></li>
<li><a href="#" data-icon="check" data-theme="b" data-bind="click: saveProduct">@(Global.ButtonSave)</a></li>

これらのバインディングに関するドキュメントを参照してください。

http://knockoutjs.com/documentation/if-binding.html

http://knockoutjs.com/documentation/visible-binding.html

于 2012-11-12T16:01:07.270 に答える
0

「isEditingProduct」がどこで定義されているかはわかりませんが、JavaScript で View Model の一部を完全に修飾せずに参照することはできません。代わりに試してください：

myViewModel.isEditingProducts = true;

また、スクリプト ブロックの場所がわかりにくいです。<li />タグ間でインライン化しないでください。その時点でスクリプトが実行されるとは限りません (ブラウザがマークアップを解析しているため)。

于 2012-11-12T16:44:12.787 に答える