1


' Tab1 '、'Tab2'、'viewModel' の 3 つのモデルを使用した JavaScript コードを次に示します
。

var CustomExport = {
    Tab1: function () {
        this.tab1Array = ko.observableArray([
            {name: "Tab1 Item1"},
            {name: "Tab1 Item2"},
            {name: "Tab1 Item3"}
        ]);
    },
    Tab2: function () {
        this.tab2Array = ko.observableArray([
            {name: "Tab2 Item1"},
            {name: "Tab2 Item2"},
            {name: "Tab2 Item3"}
        ]);
    },
    viewModel: function () {
        this.myTab1 = new CustomExport.Tab1();
        this.myTab2 = new CustomExport.Tab2();
        this.grabData = function(){
            alert(ko.toJS(CustomExport.viewModel));
        };
    }    
}

ko.applyBindings(new CustomExport.viewModel());


したがって、一般に 2 つのモデルがあり、それらのモデルからすべてのデータを json オブジェクトとして 1 つの「viewModel」モデルに取得したい場合、grabData関数はモデル データを警告する必要があります。

ここに私のHTMLコードがあります

<div data-bind="with: myTab1">
    <ul data-bind="template: {name: 'tabTmpl', foreach: tab1Array}"></ul>
</div>
<br/>
<div>------------------------------------------</div>
<br/>
<div data-bind="with: myTab2">
    <ul data-bind="template: {name: 'tabTmpl', foreach: tab2Array}"></ul>
</div>
<br/>
<input type="button" data-bind="click: grabData" value="Grab all data from Models" />


<script id="tabTmpl" type="text/html">
    <li>
        <div data-bind="text: name"></div>
    </li>
</script>


問題は次のとおりです。
「 」ボタンをクリックすると、 json オブジェクトGrab all data from the modelsとして 2 つのモデル (「Tab1」、「Tab2」) からのデータを含む必要があるアラートが表示されますが、現在、次のアラート メッセージが表示されます。

function () {
    this.myTab1 = new CustomExport.Tab1();
    this.myTab2 = new CustomExport.Tab2();
    this.grabData = function(){
        alert(ko.toJS(CustomExport.viewModel));
    };
}


また、私は自分の jsFiddle で作成しましたここをクリックして例を見てください


私は何が間違っているのですか？

4

1 に答える 1

3

thisの代わりに使用する必要がありますCustomExport.viewModel：

this.grabData = function(){
    console.log(ko.toJS(this));
};

ただし、次のクロージャを作成することをお勧めしますthis。

function () {
    var self = this;
    self.myTab1 = new CustomExport.Tab1();
    self.myTab2 = new CustomExport.Tab2();
    self.grabData = function(){
        alert(ko.toJS(self));
    };
}
于 2012-11-26T15:19:14.600 に答える