Реагировать компоненты внутри приложения Angular 1.4

Question

У меня есть угловое приложение, построенное с использованием gulp. Я хочу использовать компоненты React внутри него для различных функций. Angular-приложение загружает js через теги сценария, а React-приложение имеет собственные хранилища и т. Д. И использует React 16.

Как я могу импортировать мои компоненты и т. Д. Внутри угловых.

Answer 1

Вы можете использовать React Component с Angular Directive или использовать его внутри $onInit в angular

var HelloWorld = React.createClass({
    displayName:'Hello World',
    render:function(){
        return React.DOM.div(Test, "Hello, ",this.props.value1);
    }
});

$scope.name = 'World!';

app.directive('hello', function(){
    return {
        restrict:'E',
        scope:{
            name:'='
        },
        link:function(scope, el, attrs){
            scope.$watch('name', function(newValue, oldValue){
                var MyComponent = React.createFactory(HelloWorld);
                ReactDOM.render(
                    MyComponent({value1:newValue}),
                    el[0]
                );
            })
        }
    }
})

Answer 2

Можно использовать любой существующий адаптер AngularJS / React, например react2angular.

Все эти адаптеры имеют ReactDOM.render в $onInit хуке и ReactDOM.unmountComponentAtNode в $onDestroy.