Question

我正在编写一个测试程序来从Rotten Tomatoes API中提取数据，并且想知道在使用映射插件之后循环对象属性的最佳方法。数据非常简单，通过jquery ajax检索。

以下是数据的一小部分：

"ratings": {
  "critics_rating": "Certified Fresh",
  "critics_score": 99,
  "audience_rating": "Upright",
  "audience_score": 91
 }

这是更大映射的一部分，我在ajax回调中执行这样的映射：

self.moviedetail = ko.mapping.fromJS(data);

我意识到我可以做以下我正在尝试优化的内容：

<div data-bind-"with: moviedetail">
 <ul data-bind="with: ratings">
  <li>Critics Rating: <span data-bind="text: critics_rating"></span></li>
  <li>Critics Score: <span>data-bind="critics_score"</span></li>
   etc
 </ul>
</div>

我还没有确定如何循环每个评级，以某种数据无关的方式显示它们而不检查每个评级。使用下划线我可以循环遍历属性并获取它们的值，但不知道如何在淘汰赛中实现相同的功能。

我正在寻找的最终结果是：

<ul>
  <li>critics_rating: Certified Fresh</li>
  <li>critics_score: 99</li>
  ....
</ul>

注意：根据其中一个肯定会有效的答案，我可以预处理这样的数据，但是我想看看是否有办法在视图上进行。

if (data.ratings!=='undefined') {
  self.ratings.removeAll();
  for(var prop in data.ratings) {
    if(data.ratings.hasOwnProperty(prop)) {
        self.ratings.push({name: prop, value: data.ratings[prop]});                         
    }
  }
}

Answer 1

默认情况下，我不认为你可以使用淘汰赛。

您可以处理数据数组以将传入数据放入可以通用方式绑定的结构中，例如：

"ratings" : {
    [ "name": "critics_rating", "value": "Certified Fresh" ],
    [ "name": "critics_score", "value": 99 ],
    ...
}

然后使用HTML

<ul data-bind="foreach: ratings">
    <li>
        <span data-bind="text: name"></span>:
        <span data-bind="text: value"></span>
    </li>
</ul>

循环对象属性

1 个答案: