2

バインディングが完了し、うまく機能します。今、jquery経由で要素を作成しようとしています。私の問題は、ノックアウトと相互作用しないデータバインドでjqueryを使用して新しい要素を作成したときです。助けてください:(これは再バインドする必要があると思います.....

jqueryによって作成された追加ボタンをクリックしても機能しません:(

これは私のコードです: HTML

User List:<br>
<table>
    <thead><tr>
    <th>name</th><th>action</th>
</tr></thead>
<tbody class="user-list">
    <tr>
        <td>anthony</td>
        <td><input type="button" data-bind="click: addUser" value="add"/></td>
    </tr>    
</tbody>
</table>

<input type="button" class="btnAdd"  value="add User"/>
User to Block:<br>
<table>
        <thead><tr>
        <th>Username</th>
     </tr></thead>
    <tbody data-bind="foreach: users">
        <tr>
            <td><input data-bind="value: name" /></td>     
       </tr>    
   </tbody>
</table>

私のJS：

$(".btnAdd").bind('click',function(){
$('.user-list').append('<tr><td>joey</td> <td><input type="button" data-bind="click: addUser" value="Add"/></td></tr> ');});

function UserList(name) {
    var self = this;
    self.name = name;  
}

function UserViewModel() {
    var self = this;

    self.users = ko.observableArray();

    self.addUser = function() {
    self.users.push(new UserList("it works"));
}

}
ko.applyBindings(new UserViewModel());

よろしくお願いします！

4

3 に答える 3

0

「悪い知らせを伝えて申し訳ありませんが、あなたは現在 Knockout.js を使用しており、jQuery は過去のことを覚えているはずですが、必要な場合にのみ使用してください。その DOM 操作を忘れて、双方向のデータバインディングを楽しみにしています。

ビューモデルにバインドしていないため、ビューモデルの addUser メソッドは呼び出されません。それらの使用方法をよりよく理解するには、Knockout チュートリアルを参照してください。

<input type="button" class="btnAdd" data-bind="click: addUser"/>

self.addUser = function() {
    alert('OMGooses!');
    self.users.push(new UserList("it works"));
};

バインディングハンドラーを使用しようとするときはいつでも、独自のものではなく data-bind="" 属性を使用してください。コンテナーレス バインディングも使用できますが、その方法についてはドキュメントを参照してください。

于 2013-10-07T02:10:14.930 に答える