学习Ember.js-我该怎么做?

时间:2013-10-24 08:21:39

标签: javascript jquery ember.js handlebars.js

要学习Ember.js,我开始写一个小bookmark application。 带有所选标签的书签应显示在底部框中。

模板:

...
{{#each itemController="label"}}
  <li>
    <a href="#" {{bind-attr class=":label active:label-primary:label-default"}} {{action 'findLinks'}}>{{name}}</a>
  </li>
{{/each}}
...
{{#each links}}
  <li>{{name}}</li>
{{/each}}
...

App.LabelController:

...
App.LabelController = Ember.ObjectController.extend({
    needs: ["list"],
    active: false,

    actions: {
        findLinks: function() {
            var listController = this.get('controllers.list');

            this.toggleProperty('active');
            listController.set('model', this.get('store').find('link'));
        }
    }
});
...

标签数据:

App.Label = DS.Model.extend({
    links: DS.hasMany('link'),
    name: DS.attr('string'),
    color: DS.attr('string')
});

App.Label.FIXTURES = [
    {
        id: 1,
        name: 'Develop',
        color: 'blue'
    },
    ...
];

链接数据:

App.Link = DS.Model.extend({
    labels: DS.hasMany('label'),
    name: DS.attr(),
    url: DS.attr()
});

App.Link.FIXTURES = [
    {
        id: 1,
        name: 'Google',
        url: 'http://google.com',
        labels: [1]
    },
    ...
];

我现在的问题是在LabelController中设置模型不会更新链接列表。我也怀疑这是正确的approuch。

你会如何在Ember做这样的事情?

编辑: http://jsbin.com/Ovuw/81/edit

1 个答案:

答案 0 :(得分:1)

这是你想要的吗? http://jsbin.com/Ovuw/83/edit我对代码进行了评论,如果您有任何问题可以自由发表评论

祝你好运