挖空可观察数组下拉绑定问题

Knockout ObserableArray dropdown binding issue

本文关键字:绑定 问题 数组 观察      更新时间:2023-09-26

>我正在尝试在页面加载中从 restful wcf 服务中获取数据并绑定到不起作用的下拉列表。

        function CreateItem(name, value) {
            var self = this;
            self.itemName = ko.observable(name);
            self.itemValue = ko.observable(value);
        };
        function AppViewModel() {
            var self = this;
            self.titleList = ko.observableArray();
            self.load = function () {
                alert("click fired");
                $.ajax({
                    url: "https://mydomain/RestfulService/Service1.svc/CreateData?name=venkat",
                    type: "POST",
                    cahce: false,
                    async: false,
                    data:'',
                    dataType: "jsonp",
                    success: function (data) {
                        for (var i = 0; i < data.length; i++) {
                            self.titleList().push(new CreateItem(data[i].Description, data[i].TitleID));
                        }
                        alert("success " + data);
                    },
                    error: function (error) {
                        alert("failed " + error);
                    }
                });
            };
        };

    <div>
        <select data-bind="options: titleList(), optionsText: 'itemName', optionsValue: 'itemValue', value: selectedTitleValue, optionsCaption: 'Please choose'"></select>
    </div>
<script type="text/javascript">
    $(document).ready(function() {
        var model = new AppViewModel();
        model.load();
        ko.applyBindings(model);
    });
</script>

问题是,挖空数组在加载函数中正确填充,但下拉列表没有刷新更新的数据。我不明白问题出在哪里。请提供意见。

替换:

self.titleList().push(new CreateItem(data[i].Description, data[i].TitleID));

self.titleList.push(new CreateItem(data[i].Description, data[i].TitleID));

原因是self.titleList()返回底层数组,当您将数据推送到该数组时,Knockout 不知道更改并且不会通知视图。