javascript - 如何在 Ember 中创建递归计算属性

Question

我正在尝试编写我的第一个 ember 应用程序。它是取代新标签页的 Google Chrome 扩展程序。当应用程序从索引路由加载时，它可以正常工作。当我重新打开位于子文件夹路径上的已关闭选项卡时(即具有此类 chrome-extension://thechromeextensionhash/index.html#/3 的 url)，会发生错误。

错误是

Uncaught TypeError: Cannot call method 'get' of null

在线

path = path.concat(this.get('folder').get('path')); // inside the path computed property

这是受影响的代码:

// models/folder.js

App.Folder = DS.Model.extend({

  title: DS.attr('string'),

  level: DS.attr(),

  files: DS.hasMany('file', {
    async: true
  }),

  folders: DS.hasMany('folder', {
    async: true
  }),

  folder: DS.belongsTo('folder'),

  prefixedId: function() {
    return "folder-" + this.get('id');
  }.property('id'),

  path: function() {
    var path = [];
    if (this.get('level') !== 0) {
      path = path.concat(this.get('folder').get('path'));
    }
    path.push(this);
    return path;
  }.property('level', 'folder', 'folder.path')

});


App.Folder.FIXTURES = [
  {
    id: 1,
    title: 'Root',
    level: 0,
    bookmarks: [],
    files: [2, 3],
    folder: null
  },
  {
    id: 2,
    title: 'Folder 1',
    level: 1,
    files: [1, 2],
    folders: [],
    folder: 1
  },
  {
    id: 3,
    title: 'Folder 2',
    level: 1,
    files: [3, 4],
    folders: [4],
    folder: 1
  },
  {
    id: 4,
    title: 'Folder 4',
    level: 2,
    files: [],
    folders: [],
    folder: 3
  }
];

这是索引路由:

App.IndexRoute = Ember.Route.extend({
  redirect: function(){
    var rootFolder = this.store.find('folder', 1);
    this.transitionTo('folder', rootFolder);
  }
});

Answer 1

文件夹应该是异步的

folder: DS.belongsTo('folder', {
  async: true
}),

此外，文件夹可以为空，

  var parentFolder = this.get('folder');
  if (Ember.isEmpty(parentFolder){
    //do something else
  } else {
    // not empty
  }

因此，由于文件夹是预先 promise /空的，因此您不能依赖级别来让您知道该文件夹存在

path: function() {
  var path = [],
      parPath = this.get('folder.path');

  if (parPath) {
    path = path.concat(parPath);
  }
  path.push(this);

  return path;
}.property('folder', 'folder.path'),

http://emberjs.jsbin.com/OxIDiVU/93/edit