KNOCKOUT js observableArray 不起作用

knockout js observableArray is not working

本文关键字:不起作用 observableArray js KNOCKOUT      更新时间:2023-09-26

嗨,我正在尝试使用可观察数组进行foreach,但没有得到任何结果。

在调试数据时,就像在javascript文件中一样,数据正在加载到数组中。html代码给出如下:

<!-- ko foreach: currencyarr -->
    <option data-bind="value:id, text:label"></option>
<!-- /ko -->

并且JSON文件内容如下:

"name" : "shuvagho",
"curarr" : [
            {"id": "inr", "label": "INR"},
            {"id": "usd", "label": "USD"},
            {"id": "aud", "label": "AUD"},
            {"id": "sgd", "label": "SGD"}
]

使用挖空 js 的 JavaScript 代码如下:

self.currencyarr = ko.observableArray();
self.currencyarr(data.curarr);

你忘了在foreach中使用$data。

  var ViewModel = function(){
      var self = this;
      self.currencyarr = ko.observableArray();
      self.currencyarr(data.curarr);  
    }
    var data = {
    "name" : "shuvagho",
    "curarr" : [
                {"id": "inr", "label": "INR"},
                {"id": "usd", "label": "USD"},
                {"id": "aud", "label": "AUD"},
                {"id": "sgd", "label": "SGD"}
    ]};
    var viewModel = new ViewModel();
            ko.applyBindings(viewModel);
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<select>
<!--ko foreach: currencyarr-->
  <option data-bind="text:$data.label, value:$data.id" ></option>
<!--/ko-->
</select>

您还可以绑定选择标记中的选项。

var ViewModel = function(){
  var self = this;
  self.currencyarr = ko.observableArray();
  self.currencyarr(data.curarr);  
}
var data = {
"name" : "shuvagho",
"curarr" : [
            {"id": "inr", "label": "INR"},
            {"id": "usd", "label": "USD"},
            {"id": "aud", "label": "AUD"},
            {"id": "sgd", "label": "SGD"}
]};
var viewModel = new ViewModel();
        ko.applyBindings(viewModel);
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<select data-bind="options:$root.currencyarr, optionsText: 'label',optionsValue:'id'"></select>