Sets the element's text content.
<h1 rv-text="user.name"></h1>You can also bind text using interpolation.
<p>{ user.name } is { user.age } years old.</p>Sets the element's HTML content.
<section rv-html="item.summary"></section>Shows the element when the value evaluates to true and hides the element when the value evaluates to false.
<button rv-show="user.admin">Remove</button>Hides the element when the value evaluates to true and shows the element when the value evaluates to false.
<section rv-hide="feature.disabled"></section>Enables the element when the value evaluates to true and disables the element when the value evaluates to false.
<button rv-enabled="user.canVote">Upvote</button>Disables the element when the value evaluates to true and enables the element when the value evaluates to false.
<button rv-disabled="user.suspended">Upvote</button>Inserts and binds the element as well as it's child nodes into the DOM when the value evaluates to true and removes / unbinds the element when the value evaluates to false.
<section rv-if="item.editable"></section>Removes and unbinds the element as well as it's child nodes when the value evaluates to true and inserts / binds the element when the value evaluates to false.
<section rv-unless="item.locked"></section>Sets the element's value when the attribute changes and sets the bound object's value when the input element changes from user input (two-way).
<input rv-value="item.name">Checks the input when the value evaluates to true and unchecks the input when the value evaluates to false. This also sets the bound object's value to true/false when the user checks/unchecks the input (two-way).
Use this instead of value when binding to checkboxes or radio buttons.
<input type="checkbox" rv-checked="item.enabled">Unchecks the input when the value evaluates to true and checks the input when the value evaluates to false. This also sets the bound object's value to false/true when the user checks/unchecks the input (two-way).
Use this instead of value when binding to checkboxes or radio buttons.
<input type="checkbox" rv-unchecked="item.disabled">Binds an event listener on the element using the event specified in [event] and the bound object (should return a function) as the callback.
If the end value of the binding changes to a different function, this binder will automatically unbind the old callback and bind a new listener to the new function.
<button rv-on-click="item.destroy">Remove</button>Appends a new instance of the element in place for each item in an array. Each element is bound with a completely new nested view that contains an additional property (named whatever value is in place of [item]) which points to the current iterated item in the array.
Also note that you may bind to the iterated item directly on the parent element which contains the actual rv-each declaration.
<ul>
<li rv-each-todo="todos">
<input type="checkbox" rv-checked="todo.done"> { todo.name }
</li>
<ul>Adds a class (whatever value is in place of [classname]) on the element when the value evaluates to true and removes that class if the value evaluates to false.
<li rv-class-completed="todo.done">{ todo.name }</li>Sets the value of an attribute (whatever value is in place of [attribute]) on the element.
If your binding declaration does not match any of the above routines, it will fallback to use this binding.
<input type="text" rv-placeholder="field.placeholder">