2 |
3 | # react2angular [](https://circleci.com/gh/coatue-oss/react2angular) [](https://www.npmjs.com/package/react2angular) [](https://opensource.org/licenses/Apache2)
4 |
5 | > The easiest way to embed React components in Angular 1 apps! (opposite of [angular2react](https://github.com/coatue-oss/angular2react))
6 |
7 | ## Installation
8 |
9 | ```sh
10 | # Using Yarn:
11 | yarn add react2angular react react-dom prop-types
12 |
13 | # Or, using NPM:
14 | npm install react2angular react react-dom prop-types --save
15 | ```
16 |
17 | ## Usage
18 |
19 | ### 1. Create a React component
20 |
21 | ```js
22 | import { Component } from 'react'
23 |
24 | class MyComponent extends Component {
25 | render() {
26 | return FooBar: {this.props.fooBar}
28 |Baz: {this.props.baz}
29 |Foo: {this.props.foo}
23 |Bar: {this.props.bar.join(',')}
24 |this.props.baz(42)}>Baz
25 | {this.props.children} 26 |Foo: {props.foo}
34 |Bar: {props.bar.join(',')}
35 |props.baz(42)}>Baz
36 | {props.children} 37 |Foo: {this.props.foo}
58 |Bar: {this.props.bar.join(',')}
59 |this.props.baz(42)}>Baz
60 | {this.props.children} 61 |{this.state.result}
90 |{this.state.elementText}
91 |{this.state.testSixService}
92 |{this.props.foo}
93 | $element result 94 |{props.foo}
112 | } 113 | 114 | interface TestEightProps { 115 | onChange: jasmine.Spy, 116 | onComponentWillUnmount: jasmine.Spy, 117 | onRender: jasmine.Spy, 118 | values: string[], 119 | } 120 | 121 | class TestEight extends React.Component