Knockout.js輸入焦點點擊後

Question

我想在點擊事件被觸發後設置焦點與敲除輸入，但無法找到一個乾淨的方式來處理它，而不與DOM耦合。這裏是JS代碼，我有：

(function() { 

    var vm = { 
     text: ko.observable(), 
     items: ko.observableArray([]) 
    } 

    vm.addItem = function() { 
     vm.items.push(vm.text()); 
     vm.text(null); 
    } 

    ko.applyBindings(vm); 

}()); 

這是我的DOM：

<input type="text" data-bind="value: text" /> 
<a href="#" data-bind="click: addItem">Send</a> 

<ul data-bind="foreach: items"> 
    <li data-bind="text: $data"></li> 
</ul> 

這裏是的jsfiddle樣本：http://jsfiddle.net/srJUa/1/

我想這將焦點設置後，輸入什麼vm.addItem已完成。任何想法如何做到這一點乾淨，例如與自定義敲除綁定？

Answer 1

敲除具有用於操縱焦點的內置綁定：The "hasfocus" binding。

所以你只需要在你的viewmodel上創建一個布爾屬性並將它綁定到你的輸入上，並且如果你想要關注輸入，那麼將屬性設置爲true。

或者在你的情況，你可以直接綁定到你的text財產，所以當它是沒有任何文字它應該具有焦點：

<input type="text" data-bind="value: text, hasfocus: !text()" /> 

演示JSFiddle。

Answer 2

OK，我已經通過利用hasfocus結合解決的問題：

(function() { 

    var vm = { 
     text: ko.observable(), 
     items: ko.observableArray([]), 
     isFocused: ko.observable() 
    } 

    vm.addItem = function() { 
     vm.items.push(vm.text()); 
     vm.text(null); 
     vm.isFocused(true); 
    } 

    ko.applyBindings(vm); 

}()); 

HTML：

<input type="text" data-bind="value: text, hasfocus: isFocused" /> 
<a href="#" data-bind="click: addItem">Send</a> 

<ul data-bind="foreach: items"> 
    <li data-bind="text: $data"></li> 
</ul> 

工作樣本：http://jsfiddle.net/srJUa/2/

不知道這是最好的方式，雖然。