javascript - ComputedObservables 在 ko.mapping.fromJS 之后不会重新计算

Question

我正在使用 KnockoutJS，并且我有一个嵌套的 ViewModel-Structure，每个级别上都有计算的 Observables。父级包含其子级的总计。数据结构如下所示(简化):

vm.clientsRawData = [
    {
        ClientName: "Thomas",
        MoneyAccounts: [
            {
                Currency: "USD",
                Amount: "1000"
            }
            {
                Currency: "EUR",
                Amount: "2000"
            }
        ]
    },
    {
        ClientName: "Ann",
        MoneyAccounts: [
            {
                Currency: "CHF",
                Amount: "4000"
            }
            {
                Currency: "EUR",
                Amount: "1500"
            }
        ]
    }
]

初始化 ViewModel(使用 ko.mapping.fromJS)后，我看到“顶级(例如 vm.AllUsd()，包含每个客户端 Usd MoneyAccounts 的总和)”上的 ComputedObservables 没有刷新。总和仍然是 0。我需要做什么来计算 JS 结构映射中的总金额？

我已经尝试使用虚拟可观察量来实现此目的，但这极大地减慢了加载过程(浏览器不堪重负，挂起)

提前致谢

更新:例如，这个例子。我发现，初始化后 Client-Count 为 0。但为什么呢？

var ClientsMapping = {
  create: function (options) {
    var client = ko.mapping.fromJS(options.data, ContainersMapping)
    //Some computed observables for level one here...
    return client;
  }
}
var ContainersMapping = {
  'Containers': {
    create: function (options) {
      var container = ko.mapping.fromJS(options.data, MoneyAccountsMapping)
      container.totalChf = ko.computed(function () {
        var total = 0;
        $.each(container.MoneyAccounts(), function () {
          if (this.Currency() == "CHF") {
            total += this.Amount();
          }
        })
        return total;
      })
      //Some computed observables for level two here...
      return container;
    }
  }
}

var MoneyAccountsMapping = {
  'MoneyAccounts': {
    create: function (options) {
      var macc = new MoneyAccountModel(options.data)
      //Some computed observables for level three here...
      return macc;
    }
  }
}
var ClientModel = function (data) {
  ko.mapping.fromJS(data, {}, this);
}
var ContainerModel = function (data) {
  ko.mapping.fromJS(data, {}, this);
}
var MoneyAccountModel = function (data) {
  ko.mapping.fromJS(data, {}, this);
}
var data = [
  {
    'Clients': 'Thomas',
    'Containers': [
      {
        'ContName': 'Cont01',
        'MoneyAccounts': [
          { Currency: "CHF", Amount: 1000 },
        ]
      }
    ]
  },
{
  'Clients': 'Ann',
  'Containers': [
    {
      'ContName': 'Cont01',
      'MoneyAccounts': [
        { Currency: 'CHF', Amount: 1000 },
        { Currency: 'EUR', Amount: 500 }
      ]
    }
  ]
}
]

function viewModel() {
  var self = this;
  self.clients = ko.observableArray()
  self.clientsCount = ko.computed(function () {
    return self.clients().length
  })
}
var vm;
$(function () {
  vm = new viewModel();
  vm.clients = ko.mapping.fromJS(data, ClientsMapping);
})

Answer 1

好的，明白了。我必须像这样调用客户端 observableArray:

vm.clients(ko.mapping.fromJS(data, ClientsMapping)())

非常感谢埃里克为我指明了正确的方向。你救了我! :-)