ember.js - 如何从 DOM 中的现有元素设置子视图元素

Question

假设我有以下 DOM：

<div id="container">
   <div id="created-by-other-tools">I want this to be my child</div>
</div>

div“容器”来自 Ember.ContainerView ：

container = Ember.ContainerView.create {
        elementId: 'container'
}

div "created-by-other-tools" 来自另一个与 Ember 无关的 javascript 代码：

newDiv = document.createElement('div')
container.appendChild(newDiv)

是否可以将此 newDiv 与我的容器的子视图链接？我想要这样的东西：

 child = Ember.View.create()
 Ember.set(child,'element',newDiv)

我的想法是用我的子视图处理 newDiv 事件。

Answer 1

我已经使用 KinectJS 和 Ember.js 创建了一个示例，请参阅http://jsfiddle.net/pangratz666/e6Dfh/

Ember.View.create({
    didInsertElement: function() {
        var id = this.get('elementId');
        var stage = new Kinetic.Stage({
            container: id,
            width: 578,
            height: 200
        });

        var layer = new Kinetic.Layer();
        ...
    }
}).append();

另请查看此博客文章：http: //blog.sproutcore.com/using-raphael-js-with-sproutcore-2-0/。为 SproutCore 2.0 编写的所有内容都很难，它可能会对您有所帮助。