angular2react   

> One line of code to turn any Angular 1 Component into a React Component (opposite of react2angular)

Installation

``sh


Using Yarn:

yarn add angular2react angular angular-resource react react-dom @types/angular @types/react @types/react-dom

Or, using NPM:

npm install angular2react angular angular-resource react react-dom @types/angular @types/react @types/react-dom --save
`

Usage

$3

`js
let $injector
angular
.module('myModule')
.run(['$injector', function(_$injector) { $injector = _$injector }])
`

$3

`js
const MyComponent = {
bindings: {
fooBar: '<',
baz: '<'
},
template:

FooBar: {this.$ctrl.fooBar}

Baz: {this.$ctrl.baz}


}
`

$3

`js
angular
.module('myModule', [])
.component('myComponent', MyComponent)
`

$3

`js
import { angular2react } from 'angular2react'

const MyComponent = angular2react('myComponent', MyComponent, $injector)
`

$3

`js

`

Why step 1?

We need a reference to the $injector created by the Angular module that registered the Angular component you're exposing. That way we can manually compile your component.

If you use ngimport, you can skip step 1 and omit the last argument in step 4:

`js
import { angular2react } from 'angular2react'

const MyComponent = angular2react('myComponent', MyComponent)
`

Full Examples

https://github.com/bcherny/angular2react-demos

Caveats

- Only one way bindings (<) are supported, because this is the only type of binding that React supports
- Be sure to bootstrap your Angular app before rendering its React counterpart

Tests

`sh
npm test
``

License

Apache-2.0