MVVM and updating the ViewModel

Question

有关MVVM和kendo Mobile中数据绑定的问题：

• account.js：

  define([], function () {
      return {
          userPhone: 111
      };
  });
  

• index.html：

    <p>Phone: <span id="test-span" data-bind="html: userPhone"></span>.</p>
  

• home-view.js：

  define(["kendo", "app/account"], function (kendo, account) {
  var viewModel = kendo.observable({
      userPhone: account.userPhone
  });
  return {
      show: function() {
         viewModel.set("userPhone", account.userPhone); // LINE A
         account.userPhone = "222"; // LINE B
      },    
      viewModel: viewModel
  }
  });
  

  1. 没有行A和行B ，#test-span显示（null）
  2. 只有线A ，#test-span显示" 111"
  3. 只有行B ，#test-span显示（null）

我理解为什么＃2行为会行事。我只是不明白为什么＃1和＃3像他们一样行事。我认为MVVM和数据结合的全部要点是我可以更新account.userPhone并在全球更新视图而无需执行viewModel.set。

。

假设我有 home-view2.js， home-view3.js等，我如何更新所有查看模式将仅更改帐户属性？

Answer 1

b行B将起作用或不取决于所使用的框架，在这种情况下，kendoui并不是基于肮脏的检查。这意味着设置account.userName直接无法正常工作，需要通过在A。

等模型类中调用特殊设置器来完成更新

例如，AngularJS基于肮脏的检查，因此，如果放置在控制器上或在$apply中被调用，则B可以工作，并且无需诸如A。

之类的代码。

Angular Dirty检查工作的方式是使用普通JavaScript对象的快照，然后在适当的时刻（在事件回调，Ajax回调和Setteimeouts上）拿另一个快照。

如果两个快照有所不同，则所有观察account.userName的组件均已更新，例如DOM元素 - 这就是与普通JavaScript对象的角度双向绑定的方式。

可以根据Kendo小部件来查看Angular Kendoui的角库。

如果您对肮脏的检查感兴趣及其工作原理，请查看Angular作者的此播客，以及与他们进行比较的答案，与敲除或骨干等框架进行了比较。