reactive-rm

Plugin for reactive to conditionally remove (or reinsert) an element. Order is maintained.

Jump to: Usage - Example - Install - License

Usage

Add an attribute to the element: data-remove="expression", where expression is either a:

• string boolean ("true" or "false")
• model property name
• javascript expression (interpolated).

If thruthy, the element is removed. If falsy, the element is reinserted.

Regarding use together with the each binding (on the same element): a mutating array will likely cause problems. Either let each handle element removal (recommended) or use an immutable array.

Example

<p data-remove="false">hey now</p>
<p data-remove="removeMe">hey now</p>
<p data-remove="{ name == 'hank'}">removed</p>

var reactive = require('reactive')
  , rm = require('reactive-rm')
 
var model = {
  name: 'hank',
  removeMe: function() { return false }
}
 
reactive(template, model, {
  bindings: {
    'data-remove': rm.binding
  }
})

Note, the standard method for loading plugins, view.use(plugin), will not work (currently). This is due to attributes being interpolated by reactive, after which the plugin can't subscribe to changes.

Install

npm i reactive-rm

Then use browserify to bundle for the browser.

License

MIT © Vincent Weevers