Question

我是ember.js的新手。我目前正在开展一个学校项目，该项目本质上是一个留言板（论坛）应用程序，允许用户添加带评论的帖子。

我的应用程序包含三个模型：课程，消息，评论

课程 - ＆GT; hasMany-＆GT;消息 - ＆GT; hasMany-＆GT;评论

到目前为止，我已经能够使用过滤器查询查看所有课程和相关消息到我的服务器。除了没有更新添加到屏幕的新消息之外，添加新消息也可以正常工作。

问题：只有当我刷新页面时，才会显示我添加的新消息。

App.Router.map(function() {
    this.resource('home', { path : '/'}, function() {
        this.resource('mycourse', { path : ':course_id' } );
    });
});

App.MycourseRoute = Ember.Route.extend({
    model: function(params) {
        // the model for this route is a new empty Ember.Object
        var string = '{"filters":[{"name":"courseid","op":"eq","val":'+params.course_id+'}]}'
        return this.store.find('message', { q: string });
    }
 });

App.HomeRoute = Ember.Route.extend(
{
    model: function() {
        return this.store.find('course');
    }
});

这是我的留言控制器：

App.MycourseController = Ember.ArrayController.extend({

        actions: {

                addMessage: function(messageText) {
                        var message = messageText;

                        var messageAdd =this.store.createRecord('message', {
                                message: message,
                                posttime: "12:00pm",
                                courseid: 4,
                                userid: 1
                        });

                        messageAdd.save();
                }
        }

});

我的HTML部分：

 <script type="text/x-handlebars" id="home">
      <div class="row">
        <div class="col-sm-3 col-md-2 sidebar">
          <ul class="nav nav-sidebar">
            {{#each}}
            <li>{{#link-to 'mycourse' this.id}}{{name}}{{/link-to}}</li>
            {{/each}}
          </ul>
        </div>

        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
        <h1 class="page-header">Subscribed Courses:</h1>
        {{outlet}}
        </div>
      </div>
 </script>

 <script type="text/x-handlebars" id="mycourse">
        <button class="btn btn-default" type="button" id="create-message" {{action "addMessage" messageTxt}}>
        Post!
        </button>
      {{input type="text" value=messageTxt}}
      <br><br>

      {{#each}}
        <b>{{message}}</b>

        <li>{{posttime}}</li>
        <li>User name: {{user.username}}</li>
        <li>Course name: {{course.alt_name}}</li>
        <h4>Comments:</h4>
        {{#each comments}}
          <li>{{comment}}</li>
        {{/each}}
        <br>
      {{/each}}
 </script>

Answer 1

当你使用findQuery时（我相信与使用find查询参数相同），Ember不会返回实时更新数组，而是直接find findAll 1}} / filter。请参阅我曾经问过的this question on that exact issue。

此处的解决方案（改编自kingpin2k对所述问题的回答）是使用App.MycourseRoute = Ember.Route.extend({ model: function(params) { // the model for this route is a new empty Ember.Object var string = '{"filters":[{"name":"courseid","op":"eq","val":'+params.course_id+'}]}' return this.store.find('message', { q: string }); }, setupController:function(controller, model){ var filter = this.store.filter('color', function(color){ return model.contains(color); }); this._super(controller, filter); } });欺骗Ember进行自动更新：

{{1}}

如何在ember.js中构建评论系统

1 个答案: