Модель обновления Ember.js при изменении вида?

Question

Новое для ember здесь, и я подумал, что если вы привяжете данные между представлением и моделью, то обе стороны будут синхронизироваться, если один из них изменится.

В настоящее время у меня есть мои настройки модели с Emberfire, который возвращает массив цветов:

App.ApplicationRoute = Ember.Route.extend({ 
    model: function() { 
     return EmberFire.Array.create({ 
      ref: new Firebase("https://ember-starter.firebaseio.com/shape") 
     }); 
    }, 
    setupController: function(controller, model) { 
     controller.set('model', model); 
    } 
}); 

Мой шаблон настроен так:

<button {{action "add"}}>Draw</button> 
{{#each controller}} 
    {{#view App.ShapeView contentBinding="content"}} 
    <div>{{color}}</div> 
    {{/view}} 
{{/each}} 

У меня есть кнопка, чтобы добавить новый цвет к массив:

App.ApplicationController = Ember.ArrayController.extend ({ 
    actions: { 
     add: function() { 
     var newColor = { 
      color: "#222222" 
      }; 
      this.pushObject(newColor); 

     } 
    } 
}); 

В представлении я установил действие click для установки свойства цвета:

App.ShapeView = Ember.View.extend({ 
     click: function() { 
     var self = this; 
     var changeColor = self.set('context.color', '#121212'); 
    } 
    }); 

С текущей настройки, я могу принести/отобразить список цветов и изменить цвет на # 121212 от мыши. Однако данные не сохраняются в модели (firebase). Мне интересно, если я сделал что-то неправильно или есть лучшие способы сохранения/синхронизации изменений между представлением и моделью.

Заранее благодарю!

Answer 1

Возможно, это потому, что у вас есть опечатка в вашей функции добавления ... this.pushObject (newColore); должен быть this.pushObject (newColor);

add: function() { 
    var newColor = { 
     color: "#222222" 
     }; 
     this.pushObject(newColor); 

    } 

Удачи