流星集合更新未在客戶端上正確更新

Question

我正在嘗試更新文檔。 具體來說，我正在更改項目的順序-對象數組。 該數組稱為“資源”。 我調用一個方法來更新資源數組中每個對象的位置。 從數據庫中查看，可以看到文檔已按照正確的順序進行了更新。

如預期的那樣，在更新時，客戶端會做出反應-並使用新數據進行更新-但是，它似乎以錯誤的順序顯示了數組……就像它的“單出”一樣……（因此該項目已移至索引2出現在索引1 ...移至索引3的項目出現在索引2等），但是當我對瀏覽器進行物理刷新時，數據按預期加載。 有人在這里有一個類似（但不完全相同）的問題- 流星集合插入未在客戶端上更新 -盡管沒有答案可以解決我的問題。

在我的router.js文件中（我正在使用ironrouter）

Router.configure({
  layoutTemplate: 'layout',
  loadingTemplate: 'loading',
  notFoundTemplate: 'notFound',
  waitOn: function() {
   return [ Meteor.subscribe('playlists'), Meteor.subscribe('resources') ];
  }
});

.....

Router.route('/playlist/:_id', {
  name: 'playlistPage',
  data: function() { 
    return Playlists.findOne(this.params._id); 
  }
});

在客戶端上，我有：

          ...
'click #saveOrder': function(e, template) {
     e.preventDefault();

     var currentplaylistId = (template.data._id);

     var resourcesArray = [];
     $('#playlistTableBody tr').each(function(i) {
       var $this = $(this);
       var data = {
           title: $this.data('title'),
           type: $this.data('type'),
           resourceid: $this.data('resourceId'),
           duration: $this.data('duration'),
           order:  i
           }
           resourcesArray.push(data);
      });




Meteor.call('playlistUpdateResourceOrder', 
currentplaylistId, resourcesArray, function(error, result) {
    // display the error to the user and abort
     if (error)
     return throwError(error.reason);
     // Refresh data?
     Router.go('playlistPage', {_id: result._id});
});

和服務器

  playlistUpdateResourceOrder: function (currentplaylistId, resourcesArray) {
    Playlists.update(currentplaylistId, {
      $set: { resources: resourcesArray }
    });
    return {
      _id: currentplaylistId // return to our updated / renamed playlist
    };

  }

我的模板非常簡單：

   <tbody id="playlistTableBody">
  {{#each resources }}
    {{>resourceItem}}
  {{/each}}
</tbody>

和

<template name="resourceItem">
<tr data-title="{{title}}" data-type="{{type}}" data-resourceid="{{resourceId}}" data-duration="{{duration}}">
<td>{{title}}</td>
<td>{{type}}</td>
</tr>
</template>

Answer 1

始終對客戶端上的數據進行排序。 因為如果您在Meteor.publish中對數據進行排序，則它將僅在初始加載時對數據進行排序。

用於顯示排序資源的模板如下所示：

<template name="yourTemplate">
  {{#each resources}}
    {{>resourceItem}}
  {{/each}}
</template>

您的助手稱為“資源” ，它返回排序后的資源：

Template.yourTemplate.helpers({
  resources: function() {
    return Resources.find({}, { sort: { order: 1 } });
  }
});

您可以在助手或路由器中返回數據。 重要的部分是：

//Always sort collection on the client
Resources.find({}, { sort: { order: 1 } });

編輯：要對子文檔進行排序，可以使用Underscore函數sortBy 。 下划線默認在Meteor應用程序中：

var subDoc = [{ title: 'asdf', order: 2 }, { title: 'ah', order: 1 }];
//Sorting by order
var sorted = _.sortBy(subDoc, function(item) { 
  return item.order 
});