javascript - 在knockout js中使用可观察属性更新UI

Question

我想在更改 View 模型的可观察属性时更新 UI。

ViewModel 是:

 function UserViewModel() {
        var self = this;       
        self.name = ko.observable("Test User")
    }

声明对象并更新按钮单击时的可观察属性

 var userViewModel = {};
        $("#button").click(funtion(){
          userViewModel.name("Test");
        })

在 View 模型上应用绑定(bind)

$(funtion(){
            userViewModel = new UserViewModel();
            ko.applyBindings(userViewModel); 
})

View 是

<span data-bind="text:name"></span>

或

<span data-bind="text:name()"></span>

谢谢，请推荐。

Answer 1

您的方向是正确的，但我建议使用 knockout 绑定(bind)来处理点击，而不是使用 jQuery。

function UserViewModel() {
    var self = this;
    self.name = ko.observable("Test User");
    self.update = function() {
        self.name("Test");
    };    
}

ko.applyBindings(new UserViewModel());


<span data-bind="text:name"></span>
<button data-bind="click: update">Update</button>

这是一个fiddle