Question

我有一个打印预订列表的应用程序。有2条路线：

reservations.allReservations

reservations.newReservations

问题：

allReservations路线运行正常。如果删除或添加预订，则会自动反映在页面上。但是，newReservations路由不会在更改时刷新 - 但是如果我重新加载页面，则会有更改。

设置：

两者之间的主要区别是路线模型字段。对于allReservation路线，它是：

App.Reservations.all();

对于newReservation路线：

App.Reservations.all().filterProperty('isNew',true);

应用程序模型和数据存储的设置与Ember.js version of the TodoMVC app。

相同

路线：

App.ReservationsNewReservationsRoute = Em.Route.extend({

model: function(){
       return App.Reservation.all().filterProperty('isNew', true);
    },

    renderTemplate: function(){
       this.render('reservationList');
    },
});

控制器：

App.ReservationsNewReservationsController = Ember.ArrayController.extend({

    isEmpty: function() { 
        return this.get( 'length' ) == 0;
    }.property( '@each.length', '@each.isNew'),

});

模板reservationList.hbs：

{{#if isEmpty}}
    <li>
        <div class="text-center" style="height: 40px; margin: auto 0;">
            <label>No Reservations!</label>
        </div>
    </li>
{{/if}}
{{#each controller}}
   ... print reservations ...
{{/each}}

Answer 1

为了使用过滤后的数组，我认为你必须使用

model: function(){
   return App.Reservations.filter(function(reservation){
     return reservation.get('isNew') === true;
   });
});

返回实时FilteredRecordArray，在商店中加载新预订时更新。

使用filterProperty（）时，松开FilteredRecordArray，然后生成的数组不活动。

由于您没有使用ember-data，因此必须手动维护过滤器。我认为可以这样做。

最简单的方法是在控制器上添加一个计算属性，该属性将返回已过滤的内容，并使用App.reservations.all()填充模型显然，在模板中，您将使用{{#each controller.filteredContent}} 类似的东西：

App.ReservationsNewReservationsController = Ember.ArrayController.extend({

  isEmpty: function() { 
    return this.get( 'filtered.length' ) == 0;
  }.property('filtered.length'),

  //will be evaluated each time a reservation is added/removed, 
  //or each time a reservation's isNew property changed.
  filteredContent: function(){
     return this.get('content').filterProperty('isNew', true);
  }.property('@each.isNew')
});

另一个解决方案可能是在预留模型上添加过滤方法，并在商店中一致。

Ember.js - 过滤的模型更改不会触发渲染模板的更改

1 个答案: