7

我正在构建的应用程序使用 Ember.js 和 Raphael.js。由于我是 Ember.js 的新手,我在理解如何将两者联系在一起时遇到了一些问题。我已经看过这个演示了,但这只是让我了解了一部分。

让我这样表达我的问题:

让我们以Ember.js 文档中的“todo”演示为例。如何将图像与每个待办事项相关联,并在待办事项未完成时将该图像显示在 Raphael 绘图画布上?澄清一下,只有 1 个 Raphael 绘图表面显示所有图像。

就像在 Ember.js 演示中一样,我想为我的待办事项信息使用固定装置,但我想添加一个图像字段:

Todos.Todo.FIXTURES = [
  {
    id: 1,
    title: 'Learn Ember.js',
    isCompleted: true,
    image: 'some.png'
  },
  {
    id: 2,
    title: '...',
    isCompleted: false,
    image: 'some_other.png'
  }
];

请耐心等待,因为我对 Ember.js 的接触不多。我需要知道

  1. 在哪里以及如何初始化 Raphael 绘图表面
  2. 如何将图像添加到绘图表面,
  3. 如何根据关联任务的 isCompleted 值切换图像的可见性。
4

1 回答 1

0

无论您在其中存储图像完成数据的任何对象,都需要有一个观察者函数来响应完成状态的变化。在该函数中,您将做任何必要的事情来从 raphael 添加/删除图像。(抱歉,我不认识 raphael,所以无法准确告诉您该函数包含什么)。

观察者每次都会被调用到 Object.set('imageCompleted',true/false);

例子:

  App.RaphaelPainter = Ember.Object.extend({
    imageCompleted:null,
    paintOnRaphaelCanvas:function(){
      if(this.get('imageCompleted')){
         // erase the image from raphael
      }
      else {
         // add the image to raphael
      }
    }.observes('imageCompleted')
  });
于 2013-07-29T04:58:06.523 回答