angular-vdom

angular-vdom

Use virtual-dom components in an angular application by taking advantage of angulars new component lifecycle hooks.

Usage

// app.js
var h = require('virtual-dom/h')
var ngVirtualComponent = require('angular-vdom')
var virtualComponent = ngVirtualComponent(render, {bindings: {message: '<'}})

module.exports = require('angular')
  .module('app', [])
  .component('virtualComponent', virtualComponent)
  .name

function render (message) {
  return h('div', message)
}

// index.html

<div ng-app="app">
  <virtual-component message="Hello World!"></virtual-component>
</div>

API

angular-vdom exports a function that takes in few params:
ngVirtualComponent(render, options)

Render function
required: true
function that returns virtual nodes

Options
required: true
type: object
Default values for configuring the angular component. Binded value changes will trigger an .$onChange(), which will then rAF and render

Building

npm i && npm run build
cd example/
open index.html