1. WIKI教程
2. 学习EmberJS
3. 显示对象中的键(Displaying Keys in an Object)

显示对象中的键(Displaying Keys in an Object)

您可以使用#each-in helper在对象中显示键，并为对象中传递的每个键迭代一次。

语法 (Syntax)

<ul>
   {{#each-in array_name as |block-param| }}
      <li>{{block-param}}</li>
   {{/each}}
</ul>

在上面的代码中，模板迭代array_name ，其中包括对象和指定为block-param的对象中的每个键。

例子 (Example)

下面给出的示例使用#each-in helper显示对象中的键。 要显示项目，请使用以下命令创建组件 -

ember g component store-categories

现在打开在app/component/下创建的store-categories.js以及以下代码 -

import Ember from 'ember';
export default Ember.Component.extend ({
   willRender() {
      this.set('typesOfvehicles', {
         'Cars': ['Ferrari', 'Audi', 'BMW'],
         'Motor bikes': ['Harley-Davidson', 'Yamaha','Honda']
      });
   }
});

使用以下代码在app/templates/下创建名为store-categories.hbs app/templates/ -

<ul>
   {{#each-in typesOfvehicles as |category products|}}
      <li>{{category}}
         <ol>
            {{#each products as |product|}}
               <li>{{product}}</li>
            {{/each}}
         </ol>
      </li>
   {{/each-in}}
</ul>

要列出对象中的键，请在app/templates/下创建的application.hbs文件中使用以下代码 -

<p>This is Displaying the Keys in an Object:</p>
{{store-categories}}
{{outlet}}

输出 (Output)

运行ember服务器，您将收到以下输出 -