ionic-component-directive

The only way to use Angular 1.5 components in Ionic routes

Install

$ npm install --save ionic-component-directive

Usage

var Component = require('ionic-component-directive')

myApp.directive('myComponent', Component({
  controller: 'MyCtrl',
  template: 'mytemplate',
  bindings: {
    something: '<'
  }
}))

myApp.config(function ($stateProvider) {
  $stateProvider.state('my', {
    url: '/my',
    template: '<my-component>'
  })
})

Justification

In Ionic, you can't just use angular 1.5 components out-of-the-box in state definitions, because the components create a wrapper element.

We fix this by creating a directive with all the properties of a component and replace: true, to get rid of the wrapper element.

Unfortunately, module.component() in Angular 1.5 doesn't allow us to just set replace: true. So this was created.

License

MIT © Andrew Joslin