Ember JS : Uncaught TypeError: Cannot read property 'createRecord' of null

Ember JS : Uncaught TypeError: Cannot read property 'createRecord' of null

我已经开始使用 ember cli 开发 ember JS 应用程序。 现在的想法是通过保持点击的坐标来创建 svg 元素(圆圈)。

我使用视图捕捉鼠标点击,然后将其传递给控制器​​以创建带有坐标的圆。 我正在使用夹具适配器来存储数据。

我手动放入代码中的元素在我显示它们时工作正常。 当我想用我的控制器存储一个新节点时出现问题,我收到以下错误:

Uncaught TypeError: Cannot read property 'createRecord' of null

这是控制器文件 svg.js :

export default Ember.ObjectController.extend({
    actions:{
        createNode: function(posX,posY){
            var element= this.store.createRecord('element',{ //Here is where I get the error
                text: "element",
                x: posX,
                y: posY,
                graph: 1
            });
            element.save();
        }
    }
});

这是我的模板文件:

{{#view svg}}
  {{#each item in model}}//For each graph
    {{#each item.elements}}// For each  
        <circle {{bind-attr cx=x}} {{bind-attr cy=y}} r="5" stroke="black" stroke-width="3" fill="yellow" />
    {{/each}}
  {{/each}}
{{/view}}

相关路线:

export default Ember.Route.extend({
    model: function() {
        return this.store.find('graph');
    }
});

查看文件:

export default Ember.View.extend({
    tagName: "svg",
    attributeBindings: ['width','height'],
    width: "500",
    height: "500",

    init: function() {
        this._super();
        this.set("controller", svg.create());
    },
    click: function(evt){

        var svg= Ember.$("svg:first");
        var posX = evt.pageX - svg.position().left;
        var posY = evt.pageY - svg.position().top;
        this.get('controller').send('createNode',posX,posY);
    }
});

也许我做错了什么,但我不知道为什么 this.store 会是 null。

有什么想法吗?

提前致谢!

哎呀,我没看到你在你的初始化中在那里做什么。控制器需要由容器初始化,以便依赖注入与它们一起工作。依赖注入将商店注入控制器和路由。

随着控制器在 2.0 中被弃用,我只想说将您的操作从您的控制器移动到 route/controller 容纳该视图。您还必须将商店传递到视图中如果您不想这样做,您可以在创建商店时在控制器上手动定义商店。

在视图上定义它

{{#view svg store=store}}

注入视图,创建一个注入器并添加这个

App.inject('view', 'store', 'store:main');