Ember-Model EmbeddedHasManyArray未在模板的每个帮助器中更新

Question

我正在为一个简单的发票应用程序使用ember-model，我是ember的新手，我无法解决这里发生的事情，基本上我是在嵌入嵌套的数据中使用ember-model的hasMany，（每个发票的项目都在一个数组中），我尝试将代码放在jsbin和jsfiddle上，但是在那里没有用，所以对于那些有时间帮助的人，我在这里的保管箱中放了一个档案： Ember-Model hasMany没有在模板的{{#each}}中更新

要重现该错误，请导航至一张发票，然后使用链接导航至另一张发票，观看未更新的项目，好像它们被卡住了一样，但是如果重新加载页面，您将获得正确的项目，我在做什么错了：/ ？

以下代码当然是我实际应用程序的非常简化的版本，但它确实重现了该错误。

感谢任何愿意提供帮助的人。

Index.html

<!DOCTYPE html>
<html>
<head>
  <meta name="description" content="Ember - Starter" />
  <meta charset=utf-8 />
  <title>Ember-Model</title>
  <script src="libs/jquery-1.9.1.js"></script>
  <script src="libs/handlebars-1.0.0.js"></script>
  <script src="libs/ember-1.1.2.js"></script>
  <script src="libs/ember-model-latest.js"></script>
  <script src="app.js"></script>
</head>
<body>

<script type="text/x-handlebars">
  <h1>Invoices</h1>
  {{ outlet }}
</script>

<script type="text/x-handlebars" data-template-name="factures">
{{#each}}
    <ul>
        <li>{{#link-to 'facture' this}}{{title}}{{/link-to}}</li>
    </ul>
{{/each}}
  <hr/>
    {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="facture">
<h2>Items for {{title}}</h2>
{{#each items}}
<ul>
  <li>{{desc}}</li>
</ul>
{{/each}}
</script>

</body>
</html>

App.js

var App = Ember.Application.create();

// ROUTER
App.Router.map(function () {
    this.resource('factures', function () {
        this.resource('facture', {
            path: '/:facture_id'
        });
    });
});

App.FacturesRoute = Ember.Route.extend({
    model: function (params) {
        return App.Facture.find();
    }
});

App.FactureRoute = Ember.Route.extend({
    model: function (params) {
        return App.Facture.fetch(params.facture_id).then(function (modelData) {
            return App.Facture.find(params.facture_id);
        });
    }
});

// Redirect
App.IndexRoute = Ember.Route.extend({
    redirect: function () {
        this.transitionTo('factures');
    }
});


// MODELS
var attr = Ember.attr,
    hasMany = Ember.hasMany,
    belongsTo = Ember.belongsTo;

// Factures
App.Facture = Ember.Model.extend({
    title: attr(),
    items: hasMany('App.Item', {
        key: 'items',
        embedded: true
    })
});

App.Facture.adapter = Ember.FixtureAdapter.create();

// Facture
// -> [ Items ]
App.Item = Ember.Model.extend({
    desc: attr(""),
    qty: attr("number"),
    price: attr("string")
});

// FIXTURES

App.Facture.FIXTURES = [
{
    id: 1,
    title: "Invoice #1",
    items: [
        {id: 1, desc: 'An Item for #1', qty: 2, price: "45"}, 
        {id: 2, desc: 'An Item for #1', qty: 5, price: "75"}
    ]
}, 
{
    id: 2,
    title: "Invoice #2",
    items: [
        {id: 1, desc: 'An Item for #2', qty: 2, price: "250"},
        {id: 2, desc: 'An Item for #2', qty: 5, price: "200"}
    ]
}];

Answer 1

您的商品ID应该是唯一的，ember模型不在乎是否嵌入，如果看到的ID相同，则返回该ID已经存在的模型。

http://emberjs.jsbin.com/eKibapI/1/edit

App.Facture.FIXTURES = [
{
    id: 1,
    title: "Invoice #1",
    items: [
        {id: 1, desc: 'An Item for #1', qty: 2, price: "45"}, 
        {id: 2, desc: 'An Item for #1', qty: 5, price: "75"}
    ]
}, 
{
    id: 2,
    title: "Invoice #2",
    items: [
        {id: 3, desc: 'An Item for #2', qty: 2, price: "250"},
        {id: 4, desc: 'An Item for #2', qty: 5, price: "200"}
    ]
}];

Answer 2

我不确定为什么要在App.Facture.find()中包装App.Facture.fetch() 。 请注意，它被设置在途中return回调函数的不会被你返回model挂钩。 请尝试以下操作：

App.FactureRoute = Ember.Route.extend({
    model: function (params) {
        return App.Facture.find(params.facture_id);
    }
});

当然，这也是默认行为，因此您应该能够删除整个App.FactureRoute 。

Ember-Model EmbeddedHasManyArray未在模板的每个帮助器中更新

问题描述

Index.html

App.js

2 个解决方案

解决方案1
0 已采纳 2013-11-23 00:24:44

解决方案2
0 2013-11-23 00:27:08

Ember-Model EmbeddedHasManyArray未在模板的每个帮助器中更新

问题描述

Index.html

App.js

2 个解决方案

解决方案1 0 已采纳 2013-11-23 00:24:44

解决方案2 0 2013-11-23 00:27:08

解决方案1
0 已采纳 2013-11-23 00:24:44

解决方案2
0 2013-11-23 00:27:08