Knockoutjsのコンポーネント間の双方向バインディング

再利用可能なコンポーネントを作成しようとしていますが、私が見た投稿ボックスサブ/パブなどの外部ライブラリなしで必要な双方向バインディングを作成できません。ここでKnockoutjsのコンポーネント間の双方向バインディング

は私が

を行うにしようとしています何の例codepenそれは非常に基本的な例だが、それは私が必要なものを示しています。

mainViewModelには、name-inputコンポーネントから取得する必要があるプロパティnameがあります。

私は2+に角度を付けるために使用されていますが、双方向バインディングを使用していますが、KOには同様のものがありますか？

おかげ

スティーブ

編集： Javascriptを：

ko.components.register("name-input", { 
    viewModel: function(params) { 
    var self = this; 
    self.userInput = ko.observable(); 
    return self; 
    }, 
    template: "<div><input data-bind='textInput: userInput' placeholder='Enter your name'><br/>Hello,<span data-bind='text:userInput'></span></div>" 
}); 


function mainViewModel() { 
    var self = this; 

    self.name = ko.observable(); 
} 

ko.applyBindings(new mainViewModel(), $("#main")[0]);

HTML：

<body> 
    <div id="main"> 
    <div id="inner-container"> 
     MyName: 
     <div data-bind="text:name"></div> 
    </div> 
    <name-input></name-input> 
    </div> 
</body>

出典

2017-12-18 Steven Yates

あなたはコンポーネントインスタンスの観察可能な参照を渡すparams属性を使用することができます読み書きをする：あなたのコンポーネントの機能のviewmodelで

<name-input params="value: name"></name-input>

、あなたの代わりに新しい観測可能を作成するのでは、この値を参照します。

function(params) { 
    var self = this; 
    self.userInput = params.value; 
    return self; 
}

Running example in a fork of your Codepen

出典

2017-12-18 11:55:19 user3297291

Knockoutjsのコンポーネント間の双方向バインディング

答えて

関連する問題