从 JSON 加载值不更新（可观察到）淘汰赛

Question

我正在使用具有诸如添加新行，删除新行之类的功能的应用程序。所有的东西都工作正常。就像我第一次从项目中加载数据（我有很多视图模型绑定在单个页面），所有数据似乎都按预期工作（无论何时编辑值，在我的视图模型中更新）。但是当我第二次加载现有数据时，视图模型没有按预期更新。即使我编辑了数据，视图模型也持有相同的数据。我认为 observable 无法正常工作。请告诉我到底在哪里做错了。

第一次：

function ViewModel() {
    var self = this;

    //Available types - which will come from serverside
    self.typeDropDown = ko.observableArray(InitialData);

    self.typeValue = ko.observable();

//Explicitly Adding new Row
    self.Inputs = ko.observableArray([new Item(self.typeDropDown[0], '', '', '')]);

    self.removeRow = function (Item) {
        self.Inputs.remove(Item);
    },
    self.addNewRow = function () {
        //push will add a new element to the container without modifying much in DOM
        self.Inputs.push(new Item(self.typeDropDown[0], '', '', ''));
    }


function Item(Type, StrData, MaxData, Back) {
    var self = this;
    self.Type = ko.observable(Type),
    self.Storage = ko.observable(StrData),
    self.MaxIOPS = ko.observable(MaxData),
    self.BackupPercentagePerMonth = ko.observable(Back)
}

第二次 - 从服务器加载数据。

来自服务器的示例输入结构：

strJSON = [
   {
       Type: storageInitialData[0].Value,
       Str: '12',
       Max: '156',
       Back: '123'
   },
    {
       Type: storageInitialData[0].Value,
       Str: '12',
       Max: '156',
       Back: '123'
   }, {
       Type: storageInitialData[0].Value,
       Str: '12',
       Max: '156',
       Back: '123'
   }
];


function ViewModel() {
    var self = this;

    //Available types - which will come from serverside
    self.typeDropDown = ko.observableArray(InitialData);

    self.typeValue = ko.observable();

//Explicitly Adding new Row
    self.Inputs = ko.observableArray(strJSON);

    self.removeRow = function (Item) {
        self.Inputs.remove(Item);
    },
    self.addNewRow = function () {
        //push will add a new element to the container without modifying much in DOM
        self.Inputs.push(new Item(self.typeDropDown[0], '', '', ''));
    }

ko.observableArray(strJSON) 是否不足以为数组中的元素设置可观察属性？我需要再次调用 Item 方法吗？

更新

我的下拉菜单是这样的

<select class="ddText" id="selType" style="width: 100px"
                            data-bind="options:typeDropDown, optionsText: 'Value', optionsValue: 'Value',value : (Type.Value)?Type.Value : Type,attr: { name: 'str',id : 'strType_'+$index()}, uniqueName:true" ">
                        </select>

Answer 1

observableArray 中的项目本身不会自动变为可观察的。在将对象添加到 Inputs 之前，您必须将它们映射到 Items。 ko.utils.ArrayMap（或者内置的数组方法map，如果你可以确定你是在 ES5 浏览器中运行的话）在这里会很有帮助。您可能还想查看ko.mapping 插件（官方支持）；在您的情况下，它将生成相当于将条目映射到Items。