1

このフィドルをチェックしてください: http://jsfiddle.net/XuMzS/4/

html:

<input data-bind="value: Total" type="text" />
<textarea cols="50" rows="10" data-bind="value: testHtml, valueUpdate: 'afterkeydown'">
</textarea>
<p>Html:</p>
<div class="wrapper">
<div data-bind="html: testHtml"></div>
<br />
</div>

JavaScript:

function viewModel() {
var self = this;
self.Total = ko.observable("1337");
self.testHtml = ko.observable();

}

ko.applyBindings(new viewModel());

私がやろうとしているのは、テキストエリア内に必要なコードを記述して、観察可能な合計を表示することです(その下の div に html を表示します)。私が書いたかのように：

<span data-bind="text: Total"></span>

しかし、そのコードを書いても何も表示されません。それ以外の場合は、通常の html が機能しています。これを行う方法はありますか？

4

2 に答える 2

2

私はサンプルを作りました、これはあなたが探しているものだと思います。

function viewModel() {
    var self = this;
    self.Total = ko.observable("1337");
    self.testHtml = ko.observable("<b>test</b><span data-bind=\"text: Total\"></span>");
    self.testHtmlWrapper = ko.computed(function () {
        return '<div id="dynamicContent">' + self.testHtml() + '</div>';
    });

    self.rebind = function () {
        try {
            ko.applyBindings(self, document.getElementById("dynamicContent"));
        } catch (e) {

        }
    };
    self.testHtml.subscribe(self.rebind);

}

var vm = new viewModel();
ko.applyBindings(vm);
vm.rebind();

フィドルを見る

お役に立てば幸いです。

于 2013-05-24T15:23:32.117 に答える
0

testHtml オブザーバブルが必要なのはなぜですか?

これは、以下のコードを使用して簡単に実現できます。

ビューモデル:

function viewModel() {
    var self = this;
    self.Total = ko.observable("1337");
}

ko.applyBindings(new viewModel());

HTML:

<input data-bind="value: Total" type="text" />
<textarea cols="50" rows="10" data-bind="valueUpdate: 'afterkeydown'">
<b>test</b><span data-bind="text: Total"></span>
</textarea>
<p>Html:</p>
<div class="wrapper">
    <div><b>test</b><span data-bind="text: Total"></span></div>
    <br />
</div>

このフィドルを参照してください

于 2013-05-27T05:12:05.713 に答える