Question

我正在使用joutery的knockout.js。 availableBrands定义为：

self.availableBrands = ko.observableArray();

我的ajax请求方法是：

self.loadBrands = function () {
                $.ajax({
                    url: '/api/Electronic/GetBrands',
                    dataType: "json",
                    contentType: "application/json",
                    cache: false,
                    type: 'POST',
                    success: function (data) {
                        $.each(data,function (i,item) { self.availableBrands.push(item) });
                    },
                    error: function (jqXHR, status, thrownError) {
                        toastr.error("failed to load Brands.Please refresh page and try again", "Error");
                    }
                });
            }

我收到的数据是：

更新我使用与selectize插件绑定的敲除选项作为：

<select id="select-category" class="demo-default" data-bind="options: availableBrands,
                       value: selectedBrand,
                       optionsCaption: 'Choose brand...'"></select>

和js是：

$('#select-category').selectize({
                create: true,
                sortField: {
                    field: 'text',
                    direction: 'asc'
                },
            });

现在选择仅显示我硬编码的选项。它不显示通过ajax加载的选项。

更新2：

在我写的loadBrands函数中 self.availableBrands.push('ghi'); 并且ghi显示在选择选项中。但是没有显示通过ajax加载的数据。

我将ajax的成功改为：

success: function (data) {
                        $.each((data), function (i, item) { console.log(item); });
                    },

和控制台上的数据如下图所示

为什么通过ajax加载的数据不会显示在select？

中

Answer 1

它应该按预期工作，确保您正确引用var ViewModel = function (data) { var self = this; self.list = ko.observableArray(); $.each(data, function (i,item) { self.list.push(item) }); } ko.applyBindings(new ViewModel([11, 22, 33]));。

<强>视图模型：

$.each

检查样本here以供参考

在这种情况下，您无需使用Selectize检查here。

使用.selectize插件进行更新检查 here 。

在加载选项后尝试在ajax成功中应用(*buffer)[1] = 0;。

Answer 2

数据不是jQuery对象。您可以使用常规的javascript forEach语句

data.forEach(function(item){ self.availableBrands.push(item)})

也可能无法在回调中正确设置self。您可以执行以下操作

self.loadBrands = function () {
  var self=self;
  $.ajax({

选择不使用动态敲除选项绑定

2 个答案: