v0.8

Model

class Model extends View → file: mvc/Model.js

The Model defines behaviour of the controller's $model property.
It's one of the most important controller properties because it ensure the app reactivity. Every time the $model subproperty is changed the corresponding dd- elements will be rendered (DOM will be changed). For example this.$model.name = 'John Doe' will trigger render() method.
The $model change will emit 'model-change' event in the eventEmitter.
Beside that the Model has another property called $modeler property. It contains methods to change controller value and render HTML at the same time (setValue(), delValue(), ...)

Instance

The model instance is created in App.routes() method when controller is instantiated.

Properties

The controller instance properties (aggregated from other extended classes) are:
Property Description Type Default
$model The container for model variables. When model variable is changed the render() is activated and 'model-change' event emitted. object {}
$modeler Contains the model methods like: setValue, delvalue, getValue, mpush, mpop, munshift, mshift, mrender. See here. object {...}

Methods of the $modeler property

use(modelName) :object

Take the specific model name ($model property) for further methods like: setValue(), getValue(), ...
    ARGUMENTS:
  • modelName :string - the model name i.e. the property of this.$model
EXAMPLE:
Change the subproperty of complex "car" model object and render dd elements in HTML view. 
this.$modeler.use('car').setValue(2015, 'x.y.z.w.year'); // will set this.$model.car.x.y.z.w.year property

setValue(val, path) :void

Set the $model property value and render the HTML.
    ARGUMENTS:
  • val :any - the model value at certain path
  • path :string - the $model property path, for example 'product.name'

delValue(path) :void

Delete the $model property at a certain path and render the HTML.
    ARGUMENTS:
  • path :string - the $model property path, for example 'first_name'

getValue(path) :any

Get the $model property value at a given path. this method will not render the HTML.
    ARGUMENTS:
  • path :string - the $model property path, for example 'user.age'

mpush(arrElem) :void

Add the element at the end of the model's array and render the HTML.
    ARGUMENTS:
  • arrElem :any - a new element of the array

mpop() :void

Remove the last element from the model's array and render the HTML.

munshift(arrElem) :any

Add element to the beginning of the model's array and render the HTML.
    ARGUMENTS:
  • arrElem :any - a new element of the array

mshift() :void

Remove the first element from the model's array and render the HTML.

mrender() :void

Just render dd- elements in the HTML.

Stackblitz Examples