knockout.js - プロパティによる入力の取得

Question

プロパティの関連する入力を取得することは可能ですか? モデルが配列に追加された後、入力にフォーカスする必要があります。

var newItem = new ChildModel();
this.childItems.push(newItem);
// and then something like this:
newItem.observableProperty.focusInput();

Answer 1

hasfocusバインディングを見ることができます。selectedプロパティを追加したい場合は、次のChildModelようにすることができます: http://jsfiddle.net/jearles/sZnbU/

アイテムをオブザーバブル配列にプッシュするとき、そのselectedプロパティをに設定しますtrue。これにより、フォーカスが与えられます。各行には、Select選択できるボタンもあります。

selected新しいアイテムを追加すると、アイテムがログに記録されるため、プロパティの変更を確認できます。最後に、入力テキストボックスをクリックしてフォーカスを与えてからクリックするLogと、「選択された」アイテムは表示されません。

--

<span>
    New Item: <input data-bind="value:newItem" />
    <button data-bind="click: addItem">Add</button>
    <button data-bind="click: logItems">Log</button>
</span>
<div data-bind="foreach: items">
    <p>
        <input data-bind="value: text, hasfocus: selected" />
        <button data-bind="click: selectItem">Select</button>
    </p>
</div>​

--

var ChildItem = function(text) {
    var self = this;
    self.text = ko.observable(text);
    self.selected = ko.observable(true);
    self.selectItem = function() {
        self.selected(true);
    }
};

var ViewModel = function() {
    var self = this;
    self.items = ko.observableArray();
    self.newItem = ko.observable('');
    self.addItem = function() {
        if (self.newItem().length > 0) {
           self.items.push(new ChildItem(self.newItem()));
           self.newItem('');
           self.logItems();
        }
    };
    self.logItems = function() {
        console.log(ko.toJSON(self.items));
    }
}

ko.applyBindings(new ViewModel());    

</p>