Question

我有一个数组如下：

self.arrayObj : Array[2]
  >0:Object
   >Display1
    ->InnerObjects
   >__proto
  >1:Object
   >Display2
    -->InnerObjects

我的实际情况是显示字符串的“Display1”和“Display2” 我正在做html绑定，如下所示：

<div data-bind="foreach: self.arrayObj">
<span data-bind="text:$data[0]"></span>
</div>

如何迭代数组并仅显示文本？

Answer 1

如果您的数组只是一个字符串数组，您应该执行以下操作：

<div data-bind="foreach: self.arrayObj">
    <span data-bind="text:$data"></span>
</div>

如果你的数组是一个对象数组，例如一个属性＆＃39; Name＆＃39;，这是一个字符串，那你就这样做。 Knockout知道你在foreach中，所以它知道你循环时你所处的元素。

<div data-bind="foreach: self.arrayObj">
     <span data-bind="text:Name"></span>
</div>

Answer 2

我想回答我自己的问题。

当我们想要使用 Knockout js 在UI中使用动态键和值绑定对象时，这并不是一件简单的事情。如果我们有固定的键名，那么很容易。我做的是，将json对象转换为二维数组：

在.js文件中

var 2Darray = jsonObject.map(function(val) { 
     var keyname = Object.keys(val)[0];
     var value = val[keyname];
     return [keyname,value];
});

在html文件中，我们可以在循环中绑定它两次：

<div data-bind:"foreach:2Darray">

  <div data-bind:"foreach: $data">

   <div data-bind:"text:$data[0]">
   <div data-bind:"foreach: $data[1]">
     <div data-bind:"text:$data.val">
      </div>
   </div>
 </div>

数据在knockoutjs中绑定在数组中

2 个答案: