Angular2-React

Angular2 component used to embed react components

Usage

This assumes the user is using webpack/browserify tooling

npm install angular2-react --save
tsd install react react-dom --save

Creating a react component (MyComponent.jsx):

import React from "angular2-react/react";
// More conveinent than import * as React from "react"

export default class MyComponent extends React.Component {
render() {
const {name} = this.props;
return

;
}
}

Using the react component (app.ts):

import {Component} from 'angular2/core';
import {ReactComponent} from 'angular2-react/component';
import MyComponent from './MyComponent';

@Component({
selector: 'my-app',
template: '

My First Angular App

',
directives: [ReactComponent]
})
export class AppComponent {
embedComponent = MyComponent;
embedComponentProps = {
"name": "person"
};
}

Usage without webpack

See usage example without webpack tooling here