Directives

Directives - special attributes with ac- prefix
All properties of component are stored in special field called props
ac-value="value"
Bind props value with certain element
ac-model="model"
Two way data binding between model and html element
ac-input="inputData: selectedValue"
Allow send selectedValue from parent component to child component inputData.
ac-ref="element"
Add element to ui list. ui - is a list of reference elements
ac-class="className: showClass"
ac-class="@class"
Get 2 params: name of class, boolean(adds class if true). You can use comma(,) symbol to specify several conditions. Also @ is available, so you can bind props to className

Example
ac-style="height: height"
Binds props to css rules. Gets 2 params: height - css rule and value - value from



ac-if="this.isVisible"
Serve to hide or show element; Gets 1 params: value

Element is shown now
ac-for="items"
Repeater. Creates instance for every element in collection items

ac-attr="src: image"
Binds attr src with url from image
ac-link="documentation"
Serves for navigation inside application. In this case link leads to documentation page
ac-on="change: onChange"
Add event listener to the root element of component, that listen to child events

ac-pattern="[0-9]"
Add error class to the element if value is invalid(doesn't match the pattern)
ac-outside="outsideClick"
Trigger method outsideClick if user clicked beyond the element where ac-outside is specified