Backbone Relational — глубоко вложенные модели/коллекции

Развлекаемся с Backbone-relational.js v0.10.0

У меня есть объект JSON, который содержит вложенные модели и коллекции, для простоты я сделал пример ниже. В компании может быть много сотрудников, у сотрудников может быть один адрес и много задач.

{
    name: 'Nicks Company',
    employees: [{
        name: 'Bob',
        address: {
            line1: '1 City Lane',
            city: 'London'
        },
        tasks: [{
            description: 'Make this work'
        }]
    }, {
        name: 'Bill',
        address: {
            line1: '1 The Street',
            city: 'Birmingham'
        },
        tasks: [{
            description: 'Make a cake'
        }, {
            description: 'Fix all the things'
        }]
    }]
}

В приведенном ниже JSFiddle (консоль) вы можете видеть, что адрес представляет собой простой объект, а также закомментированный код для задач был отключен, поскольку tasks возвращается в виде массива.

JSFiddle: https://jsfiddle.net/nwa29uLv/2/

Ни модель адресов, ни набор задач не создаются как экземпляры Backbone, возможно ли это, или я раздвигаю границы этого плагина?


person Nick    schedule 05.11.2016    source источник
comment
Это то, что меня тоже расстроило, на самом деле это проблема ядра Backbone, так как многие вызовы функций коллекции возвращают массив моделей вместо другого объекта коллекции, что позволяет создавать цепочки и избегать многословия. То, что вы ищете, может быть достигнуто с помощью github.com/mikeapr4/Backbone.hierarchy или github.com/blittle/backbone-nested-models   -  person mikeapr4    schedule 07.11.2016
comment
@ mikeapr4 mikeapr4 - он работает с традиционной реляционной основой, ему не хватало reverseRelation, которая связывает подмодели обратно с моделью. Проверьте ответ ниже. В документации также есть рабочий пример =› backbonerelational.org/#examples   -  person Winter Soldier    schedule 08.11.2016


Ответы (1)


  • Вот как я решил проблему. Вы пропустили reverseRelation.
  • Кстати, вы смотрели на этот сообщение? У него похожая проблема.

Следуйте здесь

var Address = Backbone.RelationalModel.extend({});

var Task = Backbone.RelationalModel.extend({});
var TaskCollection = Backbone.Collection.extend({
  model: Task
});

var Employee = Backbone.RelationalModel.extend({
  relations: [{
    type: Backbone.HasOne,
    key: 'address',
    relatedModel: Address,
    reverseRelation: {
      type: Backbone.HasOne,
      key: 'employee'
    }
  }, {
    type: Backbone.HasMany,
    key: 'tasks',
    collectionType: TaskCollection,
    relatedModel: Task,
    reverseRelation: {
      type: Backbone.HasOne,
      key: 'operatesOn'
    }
  }]
});

var EmployeeCollection = Backbone.Collection.extend({
  model: Employee
});

var Company = Backbone.RelationalModel.extend({
  relations: [{
    type: Backbone.HasMany,
    key: 'employees',
    relatedModel: Employee,
    reverseRelation: {
      key: 'worksFor'
    }
  }]
});

var company = new Company({
  name: 'Nicks Company',
  employees: [{
    name: 'Bob',
    address: {
      line1: '1 City Lane',
      city: 'London'
    },
    tasks: [{
      description: 'Make this work'
    }]
  }, {
    name: 'Bill',
    address: {
      line1: '1 The Street',
      city: 'Birmingham'
    },
    tasks: [{
      description: 'Make a cake'
    }, {
      description: 'Fix all the things'
    }]
  }]
});

console.log('Company:', company.get('name'));
company.get('employees').each(function(employee) {
  console.log('Employee:', employee.get('name'));
  console.log('Employee:', employee.get('name'), 'Address Model:', employee.get('address').get('city'));
  employee.get('tasks').each(function(task) {
    console.log('Employee:', employee.get('name'), 'Task: ', task.get('description'));
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.3/backbone-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone-relational/0.10.0/backbone-relational.js"></script>

person Winter Soldier    schedule 07.11.2016
comment
Спасибо. Я сделал фрагмент исполняемым. Также есть ссылка на скрипку - person Winter Soldier; 09.11.2016
comment
Здорово! Ссылка на скрипку хороша, если она не может быть в исполняемом фрагменте. Но он должен сопровождаться хотя бы соответствующим образцом кода. Но тогда, теперь это избыточно, так как вы сделали фрагмент исполняемым. - person Emile Bergeron; 09.11.2016
comment
Большое спасибо за это, все работает отлично :) - person Nick; 11.11.2016