Feature: directive support in render function

[trotyl]

Integrate Directives with render function.

API Design

function directive(type: Type<any>): (value: any, extras?: object) => never

• type: the directive class;
• value: main input value for directive;
• extras: additional input key value pairs in object;

Example

import { NgClass } from '@angular/common'
import { NgModel } from '@angular/forms'
import { directive, Renderable } from 'ng-renderable'

const ngClass = directive(NgClass)
const ngModel = directive(NgModel)

@Component()
class MyComponent extends Renderable {
  @Input() active: boolean
  value: string

  render() {
    const classNames = { highlight: this.active }

    return (
      <p ngClass={ ngClass(classNames) }>
        <input ngModel={ ngModel(this.value, { ngModelOptions: { /* ... */ } }) } onNgModelChange={ (value) => this.value = value } />
      </p>
    )
  }
}