Emberjs#每个循环不处理数组数据

Emberjs #each loop not working on array data

本文关键字：处理 数组 数据 循环 Emberjs#      更新时间：2023-09-26

我只是想循环浏览我生成的一些伪数据，这样我就可以对网站进行样式设置，我的路由器中有这个：

import Ember from 'ember';
export default Ember.Route.extend({
  chatMessages() {
      return [{
      username: "John Doe",
      message: "Blah Blah Blah",
      dispic: "http://www.proirrigationwi.com/images/unknown_user.png"
    }]
  },
  activate() {
    this.controllerFor('chatroom').subscribe();
  }
});

然后在我的index.hbs 中

    {{#each chatMessages as |chatMessage|}}
      {{chat-message username=chatMessage.username message=chatMessage.message dispic=chatMessage.dispic}}
    {{else}}
      {{chat-message username="System" message="There are currently no chat messages, feel free to start talking! Someone will join eventually" dispic="asd"}}
    {{/each}}

但我只看到过其他的说法。任何信息都将是伟大的感谢

您的路线目前设置不正确，您必须在路线模型中返回聊天消息：

import Ember from 'ember';
export default Ember.Route.extend({
  chatMessages: [{
      username: "John Doe",
      message: "Blah Blah Blah",
      dispic: "http://www.proirrigationwi.com/images/unknown_user.png"
  }],
  model(){
    return this.get('chatMessages')
  },
  activate() {
    this.controllerFor('chatroom').subscribe();
  }
});

现在你可以在你的模板中访问它，如下所示：

{{#each model as |chatMessage|}}
  {{chat-message username=chatMessage.username message=chatMessage.message dispic=chatMessage.dispic}}
{{else}}
  {{chat-message username="System" message="There are currently no chat messages, feel free to start talking! Someone will join eventually" dispic="asd"}}
{{/each}}

这是我为你准备的一个小游戏。然后，重要的是再次阅读指南的这一部分，因为它从路线的角度更详细地解释了模型挂钩，以及这一部分解释了它是如何在控制器上设置的。

相关文章：