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

Question

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

我使用 View 捕获鼠标点击，然后将其传递给 Controller ​​以创建带有坐标的圆。我正在使用夹具适配器来存储数据。

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

Uncaught TypeError: Cannot read property 'createRecord' of null

这是 Controller 文件 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');
    }
});

View 文件:

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。

有什么想法吗？

提前致谢!

Answer 1

哎呀，我没看到你在 init 里做了什么。 Controller 需要由容器初始化，以便依赖注入(inject)与它们一起工作。依赖注入(inject)将商店注入(inject) Controller 和路由。

随着 Controller 在 2.0 中被弃用，我只想说将您的操作从您的 Controller 移动到包含该 View 的路由/ Controller 中。您还必须将商店传递到 View 中。如果您不想这样做，您可以在创建商店时在 Controller 上手动定义商店。

在 View 上定义

{{#view svg store=store}}

注入(inject)到 View 中，创建一个注入(inject)器并添加这个

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