如何在可观察数组中正确地将文本框值绑定回模型

How to properly bind text box value back to model in a observable array?

本文关键字：文本 绑定 模型 正确地 观察 数组      更新时间：2023-09-26

我有一个模型，有一个可观察数组，我可以在文本框中显示数据，但我不知道如何将其绑定回原始数组。

这是我的工作样本。

<ul data-bind='foreach: frameworks'>
    <li>
        <button class='btn' value='pick me'             
            data-bind='text: name, click: $parent.selectFramework'>            
        </button>
    </li>
</ul>
<input type='text' data-bind='value: selectedFramework().name' />
<pre data-bind='text: ko.toJSON($root.selectedFramework, null, 4)'>
</pre>

var Framework = {
    name: ''
};
var App = new function () {
        var self = this;
        self.frameworks = ko.observableArray();
        self.selectFramework = function (item) {
            self.selectedFramework(item);
        };
        self.selectedFramework = ko.observable(Framework);
    };
App.frameworks([{name: 'foo'}, {name: 'bar'}]);
ko.applyBindings(App);

你就快成功了。你需要让每个框架上的name属性都是可观察的。我已经在这里更新了你的JsFiddle 

App.frameworks([{
    name: ko.observable('foo')
}, {
    name: ko.observable('bar')
}]);

该值只存储在你的selectedFramework可观察对象中，所以你可以通过App.selectedFramework()来访问它。可观察对象不会接受任何变量，它会在内部存储你传递给它的任何值。如果你想要更新外部框架变量，你可以在selectFramework函数中这样做。

self.selectFramework = function (item) {
        self.selectedFramework(item);
        Framework = item;
    };
相关文章：