Question

我是knockoutJS的新手，但我正在努力将这个Vessel对象存储到一个Observable数组中。同时，我需要能够通过其唯一ID（mmsi）或其名称搜索数组中的特定对象。我假设为了做到这一点，数组必须是关联的，这样你才能搜索所有的键，直到找到你搜索过的值。但是，我对我的实施没有信心，可以使用一些指导。

这就是我所拥有的：

function Vessel(data) {
  this.mmsi = ko.observable(data.mmsi);
  this.lat = ko.observable(data.latitude);
  this.long = ko.observable(data.longitude);
  this.trueheading = ko.observable(data.trueheading);
}

function VesselViewModel() {
  // Data
  var self = this;
  self.vessels = new ko.observableArray([]);
  self.assoc = {};

  // Operations

  self.addVessel = function(m, lt, lg, th) {
    self.vessels.push(new Vessel({
      mmsi: m,
      lat: lt,
      long: lg,
      trueheading: th
    }));
  };
  self.removeVessel = function(vessel) {
    self.vessels.remove(vessel)
  };

  self.UpdateVessel = function(key, item) {
    if (self.assoc[key]) {
      self.assoc[key].value(item)
    } else {
      self.vessels.push(VesselViewModel.assoc[key] = {
        key: key,
        value: ko.observable(value)
      });
    }
  }
}

如果这是完全错误，我表示道歉，但感谢任何帮助。谢谢。

Answer 1

我真的不认为你需要做一个关联数组。您可以通过各种类型的绑定直接访问挖空对象。这是一个简单的解决方案，我花了10分钟才能淘汰。

为了编辑，因为所有内容都是可观察的，所以只需隐藏/显示表单字段就可以使它变得简单愚蠢。完成后点击完成，所有内容都已更新。

它至少会给你一个你可以做的例子。

var model;
var data = [{mmsi: '12', lat: '12', long: '12', trueheading: '12'},
  {mmsi: '13', lat: '13', long: '13', trueheading: '13'},
  {mmsi: '14', lat: '14', long: '14', trueheading: '14'},
  {mmsi: '15', lat: '15', long: '15', trueheading: '15'}];

var Vessel = function (datas) {
    var self = this;
  self.mmsi = ko.observable(datas.mmsi);
  self.lat = ko.observable(datas.lat);
  self.long = ko.observable(datas.long);
  self.trueheading = ko.observable(datas.trueheading);

  self.editing = ko.observable(datas.editing || false);

  self.editVessel = function() {
    self.editing(!self.editing());
  }
}

var viewModel = function (datas) {

  var self = this;

  self.vessels = ko.observableArray(ko.utils.arrayMap(datas, function(vesselItem){
    return new Vessel(vesselItem);
  }));


  self.addVessel = function () {
    var newVessel = {
        mmsi: '',
      lat: '',
      long: '',
      trueheading: '',
      editing: true
    };
    self.vessels.push(new Vessel(newVessel));
  }

  self.removeVessel = function (vessel) {
    self.vessels.remove(vessel);
  }


}

model = new viewModel(data);
ko.applyBindings(model);

https://jsfiddle.net/64m35xca/28/

如何使用KnockoutJS创建对象的关联数组

1 个答案: