2

我是 Ember 的新手，我正在跟随他们的 Todo 教程并制作一个基本的应用程序来创建博客文章，根据我的目的调整他们的代码。该应用程序运行良好，直到我向模板添加了一个 itemController 和一个控制器来处理isCompleted事件。它不像以前那样显示内容，而是显示：<Posts.Post:ember257:1>这似乎是模型名称，而不是content. Ember 检查员说模型具有正确的属性。它只是无法正确显示。这是一些代码：

<script type="text/x-handlebars" data-template-name="posts">
    <section id="postapp">
        <section id="main">
            <ul id="post-list">
                // new code added
                {{#each itemController="post"}}
                <li {{bind-attr class="isCompleted:completed"}}>
                    {{input type="checkbox" checked=isCompleted class="toggle"}}
                    <label>{{title}}</label>
                    <p>{{content}}</p>
                </li>
                {{/each}}
            </ul>
        </section>
    </section>
</script>

以及相关的 JavaScript（请参阅底部PostController以查看代码工作后的唯一更改）：

Posts.Post = DS.Model.extend({
    title: DS.attr('string'),
    content: DS.attr('string'),
    isCompleted: DS.attr('boolean')
});

Posts.Post.FIXTURES = [
    {
        id: 1,
        title: "JavaScript: The Dark Side",
        content: "Here is a bunch of information on the dark side of " + 
            "Javascript. Welcome to hell!" 
    },
    {
        id: 2,
        title: "The glory of underscore",
        content: "Here, we're going to talk about the many uses of the " + 
            "underscore library. Read on!"
    },
    {
        id: 3,
        title: "Objectifying Objects",
        content: "Objects are confusing, eh? Let's play around with objects " +
            "a bit to see how to really use them."
    }
];

// This is the only code that changed before the app was functioning properly
Posts.PostController = Ember.ObjectController.extend({
  isCompleted: function(key, value){
    var model = this.get('model');

    if (value === undefined) {
      // property being used as a getter
      return model.get('isCompleted');
    } else {
      // property being used as a setter
      model.set('isCompleted', value);
      model.save();
      return value;
    }
  }.property('model.isCompleted')
});

任何关于为什么不显示正确内容的见解将不胜感激。

4

1 回答 1

4

我刚刚发现了问题。content是所有 Ember 控制器的属性，因此当 Ember 呈现页面时，我的帖子内容的变量名称会造成一些混乱。当我将模型和其他地方的变量名称更改为 时post_content，页面中的内容会正确呈现。

// template
{{#each itemController="post"}}
    <li {{bind-attr class="isCompleted:completed"}}>
        {{input type="checkbox" checked=isCompleted class="toggle"}}
        <label>{{title}}</label>
        <p>{{post_content}}</p>
    </li>
{{/each}}

//model 
Posts.Post = DS.Model.extend({
    title: DS.attr('string'),
    post_content: DS.attr('string'),
    isCompleted: DS.attr('boolean')
});

并且问题解决了。

于 2013-11-11T21:38:39.810 回答