每个助手

Question

在我的控制器中，我在bid对象中有一个名为bidderArrayText的数组。

这是我的控制器代码：

import Ember from 'ember';

export default Ember.Controller.extend({
  init: function() {
    this._super();
    var socket = this.get('websockets').socketFor('ws://localhost:9999/');
    socket.on('open', this.myOpenHandler, this);
    socket.on('message', this.myMessageHandler, this);
    socket.on('close', function() {
      console.log('closed');
    }, this);
  },

  countdown: {
    days: "00",
    hours: "00",
    minutes: "00",
    seconds: "00"
  },

  bid: Ember.Object.extend({
    popUpContainerDisplay: "none",
    popUpDisplay: Ember.computed('bid.popUpContainerDisplay', function() {
      return Ember.String.htmlSafe("display: " + this.get('bid.popUpContainerDisplay'));
    }),
    popUpContainerOpacity: 0,
    popUpAcceptContainerDisplay: "none",
    popUpDeclineContainerDisplay: "none",
    popUpWarningContainerDisplay: "none",
    popUpWinnerContainerDisplay: "none",
    auctionWinnerText: "No winner was found!",
    bidderArrayText: [] 
  }),

  myOpenHandler: function(event) {
    console.log('On open event has been called: ' + event);
  },

  myMessageHandler: function(event) {
    var message = JSON.parse(event.data);

    if (message.days != null) {
      this.set('countdown.days', ("0" + String(message.days)).slice(-2));
      this.set('countdown.hours', ("0" + String(message.hours)).slice(-2));
      this.set('countdown.minutes', ("0" + String(message.minutes)).slice(-2));
      this.set('countdown.seconds', ("0" + String(message.seconds)).slice(-2));
    } else {
      this.set('bid.popUpContainerDisplay', message.popUpContainerDisplay);
      this.set('bid.popUpContainerOpacity', message.popUpContainerOpacity);
      this.set('bid.popUpAcceptContainerDisplay', message.popUpAcceptContainerDisplay);
      this.set('bid.popUpDeclineContainerDisplay', message.popUpDeclineContainerDisplay);
      this.set('bid.popUpWarningContainerDisplay', message.popUpWarningContainerDisplay);
      this.set('bid.popUpWinnerContainerDisplay', message.popUpWinnerContainerDisplay);
      this.set('bid.auctionWinnerText', message.auctionWinnerText);
      this.set('bid.bidderArrayText', message.bidderArrayText);
    }  
  },      

  actions: {
    sendBid: function() {
      var socket = this.get('websockets').socketFor('ws://localhost:9999/');
      var bid = this.get('bidTextBox');
      var bidder = this.get('bidderTextBox');

      var msgToServer = {
        bid: bid,
        bidder: bidder
      };

      socket.send(JSON.stringify(msgToServer));    
    }
  }
});

在我的模板中，我想显示数组的每个项目，但我不确定如何。这就是我所拥有的，但它不起作用：

{{#each bid.bidderArrayText as |bt index|}}
<p>{{index}}. {{bt}}</p>
{{else}}
<p>Be the first to bid!</p>
{{/each}}

正确的语法是什么？谢谢。

Answer 1

定义Bid类并在init

中创建对象

import Ember from 'ember';

var Bid = Ember.Object.extend({
    init() {
        this._super(...arguments);
        this.set('bidderArrayText', []);
    },
    popUpContainerDisplay: "none",
    popUpDisplay: Ember.computed('bid.popUpContainerDisplay', function() {
        return Ember.String.htmlSafe("display: " + this.get('bid.popUpContainerDisplay'));
    }),
    popUpContainerOpacity: 0,
    popUpAcceptContainerDisplay: "none",
    popUpDeclineContainerDisplay: "none",
    popUpWarningContainerDisplay: "none",
    popUpWinnerContainerDisplay: "none",
    auctionWinnerText: "No winner was found!",
    //bidderArrayText: []  always do it in init

});
export default Ember.Controller.extend({
    init() {
        this._super(...arguments);
        this.set('bid', Bid.create());
    }
});