BindAttribute

declaration

BindAttribute

milo.attributes.bind
BindAttribute class parses/validates/etc. an attribute that binds DOM elements to milo components.
Possible attribute values are:

:myView - only component name
View:myView - class and component name
[Events, Data]:myView - facets and component name
View[Events]:myView - class, facet(s) and component name

See binder for more information.

var BindAttribute = _.createSubclass(Attribute, 'BindAttribute', true);

####BindAttribute instance methods####

attrName
parse
validate
render

_.extendProto(BindAttribute, {
    attrName: attrName,
    parse: parse,
    validate: validate,
    render: render
});

BindAttribute class methods

setInfo

_.extend(BindAttribute, {
    setInfo: BindAttribute$$setInfo
});


module.exports = BindAttribute;

attrName

function

attrName()

BindAttribute instance method that returns attribute name, by default - 'ml-bind'.
To configure bind attribute name use:

milo.config({ attrs: { bind: 'cc-bind' } }); // will set bind attribute to 'cc-bind'

function attrName() {
    return config.attrs.bind;
}

parse

function

parse()

BindAttribute instance method that parses bind attribute if it is present on the element.
It defines properties compClass, compFacets and compName on BindAttribute instance.
Returns the instance for method chaining.

function parse() {
   if (! this.node) return;

   var value = this.get();

   if (value)
       var bindTo = value.match(ATTRIBUTE_REGEXP);

   if (! bindTo)
       throw new Error('invalid bind attribute ' + value);

   this.compClass = bindTo[1] || 'Component';
   this.compFacets = (bindTo[2] && bindTo[2].split(FACETS_SPLIT_REGEXP)) || undefined;
   this.compName = bindTo[3] || componentName();

   return this;
}

validate

function

validate()

BindAttribute instance method that validates bind attribute, throws if it has an invalid value.
Returns the instance for method chaining.

function validate() {
    check(this.compName, Match.IdentifierString);

    if (! this.compClass)
        throw new Error('empty component class name ' + this.compClass);

    return this;
}

render

function

render()

BindAttribute instance method that returns the attribute value for given values of properties compClass, compName and compFacets.
If this.compName is not set it will be generated automatically.

function render() {
    this.compName = this.compName || componentName();
    return ATTRIBUTE_TEMPLATE
                .replace('%compClass', this.compClass || '')
                .replace('%compFacets', this.compFacets && this.compFacets.length
                                            ? '[' + this.compFacets.join(', ') + ']'
                                            : '')
                .replace('%compName', this.compName);
}

BindAttribute$$setInfo

function

BindAttribute$$setInfo()

Option name	Type	Description
el	Element
componentClass	String	optional class name
componentName	String	optional
componentFacets	Array.<String>	optional extra facet to add to the class

BindAttribute class method

function BindAttribute$$setInfo(el, componentClass, componentName, componentFacets) {
    var attr = new BindAttribute(el);
    _.extend(attr, {
        compClass: componentClass,
        compName: componentName,
        compFacets: componentFacets
    });
    attr.decorate();
}