@victorenator/backbone-deep-model

Improved support for models with nested attributes.

Usage no npm install needed!

<script type="module">
  import victorenatorBackboneDeepModel from 'https://cdn.skypack.dev/@victorenator/backbone-deep-model';
</script>

README

NOTE: I no longer have time to maintain this module. Please see the forks list for actively maintained projects, such as https://github.com/kahwee/backbone-deep-model

backbone-deep-model

Improved support for models with nested attributes.

Allows you to get and set nested attributes with path syntax, e.g. user.type.

Triggers change events for changes on nested attributes.

Dependencies

Backbone >= 0.9.10

Installation

  1. Include Backbone and it's dependencies in your page/app.
  2. Include distribution/deep-model.min.js

Usage

Then just have your models extend from Backbone.DeepModel instead of Backbone.Model.

Example code:

import {DeepModel} from 'backbone-deep-model';

// Create models with nested attributes
const model = new DeepModel({
  id: 123,
  user: {
    type: 'Spy',
    name: {
      first: 'Sterling',
      last: 'Archer'
    }
  },
  otherSpies: [
    { name: 'Lana' },
    { name: 'Cyrril' }
  ]
});
    
// You can bind to change events on nested attributes
model.bind('change:user.name.first', (model, val) => {
  console.log(val);
});

// Wildcards are supported
model.bind('change:user.*', function() {});
    
// Use set with a path name for nested attributes
// NOTE you must you quotation marks around the key name when using a path
model.set({
  'user.name.first': 'Lana',
  'user.name.last':  'Kang'
});
    
// Use get() with path names so you can create getters later
console.log(model.get('user.type'));    // 'Spy'

// You can use index notation to fetch from arrays
console.log(model.get('otherSpies.0.name')) //'Lana'

Author

Contributors