3

私のindex.htmlには、次のテンプレートがあります

<script type="text/x-handlebars">
    {{#with ChatApp.messagesController}}
      {{view Ember.TextArea valueBinding="content.message" rows="12" cols="70"}}
    {{/with}}
  </script>

私のメッセージモデルは次のようになります

ChatApp.Message = Ember.Object.extend({
  message: null
});

私のメッセージビューとコントローラーは次のようになります

ChatApp.messagesView = Ember.View.extend({});

ChatApp.messagesController = Ember.ArrayController.create({                                                                                           
  content: [],
  text: '',
  sendMessage: function() {
    var newChatText = this.get('text');
    socket.emit('sendchat', newChatText);
  },
  updateChat: function(username, text) {
    var controller = this;
    var content = this.get('content');
    var newMessage = ChatApp.Message.create({ message: text });

    content.push(newMessage);
    console.log("update " + controller.get('content'));
    controller.set('content', content);
  }
});

console.log を見ると、更新のたびに別のモデル オブジェクトがコンテンツに追加されていますが、テキスト領域は更新されていません。

jsFiddle の URL は次のとおりですhttp://jsfiddle.net/eDfKJ/

前もって感謝します

4

2 に答える 2

4

代わりに、コンテンツにバインドし、すべてのメッセージの集約された文字列を返す計算されたプロパティを用意し、それにテキストエリアをバインドします。

何かのようなもの：

messages: function() {
    var content = this.get('content');
    var messages = "";

    ... loop the content and combine the messages string... 

    return messages;

}.property('content.@each')

そしてあなたのテンプレートで：

  <script type="text/x-handlebars">
    {{#with ChatApp.messagesController}}
      {{view Ember.TextArea valueBinding="content.messages" rows="12" cols="70"}}
    {{/with}}
  </script>
于 2012-08-02T15:28:13.723 に答える
2

@ShaiRez と @sly7_7 の両方の協力が必要だったので、ここに最終的な作業ソリューションを含めたいと思いました

<script type="text/x-handlebars">
    {{#with ChatApp.messagesController}}
      {{view Ember.TextArea valueBinding="messages" rows="12" cols="70"}}                                                                                                            
    {{/with}}
  </script>

ChatApp.messagesController = Ember.ArrayController.create({
  content: [],
  text: '',
  sendMessage: function() {
    var x = this.get('text');
    socket.emit('sendchat', x);
  },    
  updateChat: function(username, text) {
    var controller = this;
    var newMessage = ChatApp.Message.create({ message: text });
    controller.content.pushObject(newMessage);
  },
  messages: function() {
    var content = this.get('content');
    var messages = "";
    for(i = 0; i < content.length; i++) {                                                                                                                                            
      messages += content[i].message                                                                                                                                                 
      messages += '\n';
    }
    return messages;
  }.property('content.@each')
  });
于 2012-08-02T17:54:34.737 に答える