Question

我是KO新手，在我的html文件中，我正在打印这样的值-

<!-- ko foreach: { data: JSON.parse($parent.options), as: 'option' } -->
    <!-- ko if: option.label === 'AAA' || option.label === 'BBB'  -->
        <dd class="values" data-bind="html: option.value"></dd>
    <!-- /ko -->    
<!-- /ko -->

其工作正常。但是我想要的是，我想将loop的所有值分配给一个变量，并希望在循环后打印。就像我们在php-

中所做的一样

foreach($data as $key=> $index){
    if($key==0)
        $var = $index['value'];
    else
        $var .= ' '.$index['value'];    
}

echo $var

想使用上述KO循环在KO的html文件中做同样的事情。

请帮助我。

谢谢

Answer 1

您可以这样创建2个 computed 属性。

parsedOptions获取已解析的JSON。
concatenatedValues可以使用 map 和 join 获取以空格分隔的值。

然后在parsedOptions中循环通过foreach。并将concatenatedValues绑定到span

const JSONstring = JSON.stringify([{ label: "AAA", value: 1 },{ label: "BBB", value: 2 },{ label: "CCC", value: 3 }]);

const viewModel = function() {  
  this.options = JSONstring;
  
  this.parsedOptions = ko.computed(() => {
    return JSON.parse(this.options)
  });
  
  this.concatenatedValues = ko.computed(() => {
    return this.parsedOptions().map(a => a.value).join(' ')
  });
}

ko.applyBindings(new viewModel())

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

<!-- ko foreach: { data: parsedOptions, as: 'option' } -->
    <!-- ko if: option.label === 'AAA' || option.label === 'BBB'  -->
        <dd class="values" data-bind="html: option.value"></dd>
    <!-- /ko -->
<!-- /ko -->

<br> All values:
<span data-bind="text: concatenatedValues"></span>

通过html中的敲除循环将值存储在变量中

1 个答案: