0

在使用 Kendo MVVM 框架的 Kendo 应用程序中：我有一个“全局”视图模型，它是应用程序所有部分共有的信息 - 例如 UserState，它有一个属性 isLoggedIn。

许多不同的 View 和 ViewModel 访问 userState 对象（据我所知，1 View 绑定到 Kendo 中的 1 ViewModel）。

例如，如果未通过身份验证，我的主页可能会显示登录按钮。然后，一旦您登录，所有其他屏幕的行为都会有所不同，因此每个 ViewModel 都需要引用 UserState 对象。但是，如果其中任何一个更改了它，那么所有其他视图都应该更新，因为我使用了 Kendo Observable 对象。这似乎不起作用。

我在这里设置了一个简单的例子来说明问题：http: //jsfiddle.net/rodneyjoyce/uz7ph/11

var app = new kendo.mobile.Application();   

userState = (function ()
{
    var userStateViewModel = kendo.observable({
                                                  isLoggedIn: false
                                              });    
    function loginUser()
    {
        userStateViewModel.set("isLoggedIn", true);
        alert('Logged in');
    };

    return {            
        userStateViewModel: userStateViewModel,
        loginUser: loginUser
    }
})();

var viewModel1 = kendo.observable({
    label: 'ViewModel1',
    isLoggedInVM1: function() {
        return userState.userStateViewModel.get("isLoggedIn");
    },
    logIn: function ()
    {
        //when calling LoginUser from here, the binding is not updated, even though the value is changed (true)
        userState.loginUser();
        alert('After Login viewModel1.isLoggedInVM1() = ' + viewModel1.isLoggedInVM1() + ' but the binding has not updated');
    }  

});

alert('Value onLoad = ' + viewModel1.isLoggedInVM1());

//If you uncomment this and call LoginUser from here then afterwards the binding changes to true, but not if you call it from within ViewModel1
//userState.loginUser();


kendo.bind($("#testForm"), viewModel1);

当我调用 userState.loginUser() 来更改 userStateViewModel 中 isLoggedIn 的值时，它不会更新。运行并单击按钮以查看问题 - 绑定不反映更新的值（但警报框会）。任何帮助表示赞赏，谢谢。

注意：这是对较早问题的扩展，它让我更进一步。

4

1 回答 1

2

问题是这userState是一个简单的对象，而不是ObservableObject. 因此，userStateViewmodel可观察对象的更改事件不会触发更改事件，viewmodel1视图也不会更新。

您可以通过创建userState的属性来解决此问题viewModel1，因此它被包装在一个可观察对象中（或者您可以将 IIFE 中的返回对象包装在一个可观察对象中）：

var viewModel1 = kendo.observable({
    label: 'ViewModel1',
    userState: userState,
    isLoggedInVM1: function() {
        return userState.userStateViewModel.get("isLoggedIn");
    },
    logIn: function ()
    {
        userState.loginUser();
    }          
});

看看这个演示；尝试评论该userState属性，您会看到不同之处。

于 2014-03-04T03:53:23.653 回答