![](/img/trans.png)
[英]EmberJS: Error while loading route: TypeError: Cannot read property 'map' of null
[英]Emberjs dynamic segment: Error while loading route: TypeError {}
我想在这里熟悉动态细分。 这是我想要实现的目标:
当我访问'/#/ inventoryories'时,它会在'库存'模板中列出库存模型。 这是成功完成的。
当我点击单个广告资源ID时,它将访问/#/ inventoryories / 1为1是库存ID,它将启动“广告资源”模板。 这也成功完成了。
但是,当我尝试直接从地址栏访问/#/ inventoryories / 1时,当我按F5时,它会出现此错误 - Error while loading route: TypeError {}
完整的错误列表:
Uncaught TypeError: Object function () {
if (!wasApplied) {
Class.proto(); // prepare prototype...
}
o_defineProperty(this, GUID_KEY, undefinedDescriptor);
o_defineProperty(this, '_super', undefinedDescriptor);
var m = meta(this);
m.proto = this;
if (initMixins) {
// capture locally so we can clear the closed over variable
var mixins = initMixins;
initMixins = null;
this.reopen.apply(this, mixins);
}
if (initProperties) {
// capture locally so we can clear the closed over variable
var props = initProperties;
initProperties = null;
var concatenatedProperties = this.concatenatedProperties;
for (var i = 0, l = props.length; i < l; i++) {
var properties = props[i];
Ember.assert("Ember.Object.create no longer supports mixing in other definitions, use createWithMixins instead.", !(properties instanceof Ember.Mixin));
for (var keyName in properties) {
if (!properties.hasOwnProperty(keyName)) { continue; }
var value = properties[keyName],
IS_BINDING = Ember.IS_BINDING;
if (IS_BINDING.test(keyName)) {
var bindings = m.bindings;
if (!bindings) {
bindings = m.bindings = {};
} else if (!m.hasOwnProperty('bindings')) {
bindings = m.bindings = o_create(m.bindings);
}
bindings[keyName] = value;
}
var desc = m.descs[keyName];
Ember.assert("Ember.Object.create no longer supports defining computed properties.", !(value instanceof Ember.ComputedProperty));
Ember.assert("Ember.Object.create no longer supports defining methods that call _super.", !(typeof value === 'function' && value.toString().indexOf('._super') !== -1));
if (concatenatedProperties && indexOf(concatenatedProperties, keyName) >= 0) {
var baseValue = this[keyName];
if (baseValue) {
if ('function' === typeof baseValue.concat) {
value = baseValue.concat(value);
} else {
value = Ember.makeArray(baseValue).concat(value);
}
} else {
value = Ember.makeArray(value);
}
}
if (desc) {
desc.set(this, keyName, value);
} else {
if (typeof this.setUnknownProperty === 'function' && !(keyName in this)) {
this.setUnknownProperty(keyName, value);
} else if (MANDATORY_SETTER) {
Ember.defineProperty(this, keyName, null, value); // setup mandatory setter
} else {
this[keyName] = value;
}
}
}
}
}
finishPartial(this, m);
delete m.proto;
finishChains(this);
this.init.apply(this, arguments);
} has no method 'find'
这是我的app.js
:
Gymi = Ember.Application.create();
// Route map
Gymi.Router.map(function() {
this.resource('inventories', { path: '/inventories' }, function() {
this.resource('inventory', { path: '/:inventory_id' });
});
this.resource('products');
});
// inventory models
Gymi.Inventory = Ember.Object.extend();
Gymi.Inventory.reopenClass({
items: [],
all: function() {
this.items = [{
id: 1,
name: 'item1',
cost: '20.00',
qty: 10
}, {
id: 2,
name: 'item2',
cost: '20.00',
qty: 10
}, {
id: 3,
name: 'item3',
cost: '20.00',
qty: 10
}, {
id: 4,
name: 'item4',
cost: '20.00',
qty: 10
}];
return this.items;
}
})
// inventory controller
Gymi.InventoriesController = Ember.Controller.extend({
inventories: Gymi.Inventory.all()
});
这是模板:
<script type="text/x-handlebars">
<h2>{{title}}</h2>
<ul>
<li>{{#linkTo 'inventories'}}Inventories{{/linkTo}}</li>
</ul>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="inventories">
<h2>Inventory</h2>
<table class="table">
<tbody>
{{#each inventory in inventories}}
{{#with inventory}}
<tr>
<td>{{#linkTo 'inventory' inventory}}{{id}}{{/linkTo}}</td>
<td>{{name}}</td>
<td>{{cost}}</td>
<td>{{qty}}</td>
</tr>
{{/with}}
{{/each}}
</tbody>
</table>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="inventory">
<h4>Inventory</h4>
<ul>
<li>{{id}}</li>
<li>{{name}}</li>
<li>{{cost}}</li>
<li>{{qty}}</li>
</ul>
</script>
不是OP的答案,而是对于2013年9月1日之后收到错误的所有人,可能是由于Ember Data更新到最新的1.0版本。 所以你必须使用
this.store.find('model');
代替
App.Model.find();
这是一个无用的错误消息,但关键部分是它的结尾。
this.init.apply(this, arguments);
} has no method 'find'
当你访问/inventories/1
路由时,ember将尝试使用find
在InventoryRoute
的model
钩子中查找该id的记录。 在这种情况下, Inventory
。 由于找不到该方法,因此会出现此错误。
添加一个返回与params.inventory_id
匹配的记录的Inventory.find
方法将解决此问题。
如果您的路径缺少model
方法的参数,则会出现此错误。
从link-to
访问/inventory/1
但不从URL打开页面时,以下代码有效:
App.InventoryRoute = Ember.Route.extend({
model: function() {
this.store.find('inventory', params.inventory_id)
}
});
添加缺失的params
修复。 此代码可以从link-to
URL直接使用:
App.InventoryRoute = Ember.Route.extend({
model: function(params) {
this.store.find('inventory', params.inventory_id)
}
});
对于ember-data <0.14,这是代码
App.InventoryRoute = Ember.Route.extend({
model: function(params) {
App.Inventory.find(params.inventory_id)
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.