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');
我已经开始使用 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');