Может ли angular и реагировать вместе?

Я действительно люблю полюбить angular, но реакция получает много внимания. Действительно ли они противостоят силам?

Хорошо ли использовать реакцию и angular вместе? Могу ли я? Должен ли я?

Каковы плюсы и минусы их смешивания?

Реагирует на пользовательский интерфейс, но angular может обрабатывать контроллер и представление... но лучше реагирует на обработку представления? Можем ли мы сделать лучшее приложение, отведя angular только к контроллеру?

Любые хорошие ресурсы для этого?

Одна вещь, которая мне нравится в angular, которая, по-видимому, менее верна, реагирует на то, что angular действительно позволяет вам разделять проблемы, тогда как реакция начинает немного путать это. Похоже, что это противоречит angular -way, по крайней мере.

ОТВЕТЫ

Ответ 1

Они действительно противостоят силам?

В некотором смысле они есть, а в каком-то другом смысле это не так. Люди определенно используют React внутри директив Angular, но в основном они делают это, чтобы повысить производительность, а не потому, что считают, что React - это потрясающе. И если вы только изучаете "Реакт" для лучшей производительности, вы действительно теряете ценность предложения с помощью React.

Я бы сказал, что они выступают против сил в том, что они решают одни и те же проблемы. Несмотря на то, что аргумент о том, что React - это просто V в MVC и Angular, - это "полномасштабная инфраструктура", которую часто бросают, Angular и React очень сопоставимы.

Angular имеет контроллеры и директивы (а также службы и фабрики), тогда как у React есть только компоненты. Из-за этого легко понять, что Angular является более полной структурой. Но разрешите это.

Контроллеры

React не содержит ничего, называемого контроллером, но существует концепция в мире React, называемая "контроллером представлений", которая довольно хорошо отображает контроллеры Angular. Реактивный "контроллер просмотра" определяется как любой другой компонент React, но он выполняет минимальный рендеринг. Его задачей является управление данными/состоянием, а затем передача этого состояния вниз для просмотра компонентов, которые затем отображают данные/состояние.

Простым примером может быть:

var ViewComponent = React.createClass({
  render() {
    return (
      <ul>
        {this.props.items.map(item => <li>{item.text}</li>)}
      </ul>
    );
  }
});

var ViewController = React.createClass({
  getInitialState() {
    return {
      items: []
    };
  },
  componentDidMount() {
    SomeStore.getItems()
      .then(items => this.setState({items: items}));
  },
  render() {
    return <ViewComponent items={this.state.items} />;
  }
});

Итак, ViewComponent здесь обеспокоен спецификой визуализации HTML, а ViewController обеспокоен получением и управлением данными, которые он передает в ViewComponent.

директивы

Я не думаю, что кто-то утверждает, что концепция директив Angular очень хорошо отображает компоненты React view.

Услуги и заводы

Это то, что существует в Angular только потому, что оно имеет концепцию Dependency Injection, и в основном единственный аргумент для "Angular - это более полная структура, чем React". Вы можете спорить в течение нескольких дней, если Угловой способ DI хорошо подходит для языка, такого как Javascript, и если Javascript действительно нуждается в чем-то подобном, так как он настолько динамичен, но не допускайте этого.

Вместо создания собственной модульной системы, такой как Angular (и я думаю, мы все можем согласиться с тем, что модули Angular сами по себе добавляют очень мало значения), React позволяет вам использовать любую понравившуюся вам систему модулей. Transpiled ES6, CommonJS, AMD, простые старые глобалы и т.д. Сообщество в значительной степени согласилось с ES6 и CommonJS, что хорошо (и Angular движется в этом направлении с помощью Angular 2).

Итак, если DI - это ваша вещь, это очень легко реализовать вместе с хорошей модульной системой. И даже действительно интересный подход совершенно нового подхода к DI в Реагировании с Пит Хант: http://jsfiddle.net/cjL6h/

Хорошо ли использовать реакцию и Angular вместе? Могу ли я? Должен Я?

Я бы сделал это, только если вы планируете перейти к Реагировать по линии. Ваше приложение будет сложнее понять и усложнить, так как вам нужно знать как Angular, так и React. Тем не менее, многие люди, похоже, используют React внутри Angular, так что это только мое мнение.

Реакция на интерфейс, но Angular может обрабатывать контроллер и взгляд... но лучше реагирует на обработку представления? Можем ли мы сделать лучше приложение, отклонив Angular только на контроллер?

Как я уже говорил, это распространенное заблуждение. Angular и React решает те же проблемы, но по-разному. Преимущество не связывать ваш уровень бизнес-логики с модульной системой Angular заключается в том, что легче переносить на что-то еще. Множество людей используют архитектуру Flux вместе с React, но нет ничего конкретного для Flux. Вы можете использовать идеи Flux с любыми фреймами.

Одна вещь, которая мне нравится в Angular, которая кажется менее правдой с что Angular действительно позволяет вам разделять а реакция начинает немного путать. Кажется вопреки angular -way, по крайней мере.

Я очень не согласен с этим. Я считаю, что мои приложения React лучше разделяют проблемы, чем мои приложения Angular (и я часто использовал Angular). Вам просто нужно понять способ мышления Реакт, а также хорошая идея узнать, что такое Flux. Я не говорю, что вы не можете писать отличные приложения в Angular, это просто мой опыт, что легче "попасть в яму успеха" с помощью React, чем с помощью Angular.

Angular имеет двухступенчатую кривую обучения. Сначала вы создаете контроллер с областью действия, добавляете массив в область действия и печатаете это с помощью ng-repeat, и вас удивляет, насколько это было просто. Вы добавляете директиву, которая немного сложнее понять, но вы копируете и вставляете ее, и она работает. Йеай! Затем, когда вы копаете глубже, вы нажмете второй шаг в своей кривой обучения, где вам нужно начать понимать внутренние элементы Angular. Вы должны знать, что области наследуют друг от друга прототипное наследование и последствия этого (нужна точка во всех выражениях ng-model и т.д.). И что с контрольными контроллерами? Каковы они и как они сравниваются с обычными контроллерами? И что такое переключение? И кто-то сказал мне, что мне нужно выполнить это и это на этапе компиляции моей директивы, что это?

С React начальная кривая обучения немного круче. Но как только вы закончите, нет второго шага. Learning Flux можно считать вторым шагом, но изучение Flux дает вам новые знания, которые переносятся на другие структуры JavaScript, что-то вроде "этапа компиляции в директиве Angular".

Другим большим преимуществом, которое React имеет над Angular, является то, что он в основном просто Javascript. Свойства элементов React - это просто объекты или функции Javascript вместо магических строк, например, в атрибутах Angular. Это также означает, что ваш обычный linter может сказать вам, есть ли ошибка в вашем выражении атрибута обратного вызова. В Angular вам нужно запустить код, чтобы узнать, работает ли он.

И поскольку Javascript уже имеет область блокировки, вам не нужно беспокоиться о префиксах ваших имен элементов чем-то, что делает их уникальными.

Итак, я говорю, что Angular бесполезен и что вы должны перейти к React? Нет. Многие компании вложили много средств в Angular. Но если вы спросите меня, в Angular есть больше причуд и странностей, о которых вам действительно нужно знать, если вы собираетесь создавать поддерживаемое приложение. Вы также должны подумать о том, что Angular 2 - полная переписывание, и это вызвало много вдохновения из React (это здорово!).

Ответ 2

Да, вы можете, как сказал @Edward Knowles, использовать directives, чтобы использовать React. Хотя вы можете использовать ngReact, вы также можете легко создавать директивы, чтобы использовать React.

В Angular директивы - лучший способ интегрировать компоненты View Oriented в ваше приложение angular, а React - это одна структура, очень ориентированная на уровень представления/представления.

Так как React использует селекторы для добавления и рендеринга частей вашей страницы, вы можете создать директиву, которая работает в angular следующим образом:

  • Вы собираете данные и обрабатываете их в логике angular через services и controllers (уровень обслуживания и данных)
  • Затем directive получает и может манипулировать этими данными (тип слоя модели).
  • Затем directive вызывает React и передает ему информацию для правильной обработки вашей информации, как вы хотите, используя полезные функции React. (Просмотр слоя)

Вот большой и довольно короткий видео об интеграции angular + React + D3 для создания базовой диаграммы.

Ответ 3

Да вы можете использовать директиву ngReact. Есть некоторые варианты использования, в которых вы можете это сделать, однако с этим летом, Angular 2, я бы попробовал реализовать его еще.

Что касается скорости, вы должны смотреть этот отличный разговор во время ng-conf в начале этого года.

Ответ 4

Если вы обнаруживаете, что используете Angular и React вместе, https://github.com/bcherny/ngimport - действительно хороший мост между ними. Он позволяет вам обмениваться услугами/поставщиками/фабриками/значениями/константами между Angular и внешним миром import/require, как и любым другим кодом. Надеюсь, это поможет!

Ответ 5

Extjs - это современная, если не прямая замена React и Angular. Один тангенциальный ответ - взглянуть на ExtReact. ExtReact - это попытка ExtJs хорошо играть с React. Преимущество которого заключается в возможности повторного использования компонентов React в Extjs Applications.

Ответ 6

Просто мысль: да, мы можем использовать оба в одном проекте, но это хорошо для учебной цели, но тот же проект трудно поддерживать и стоимость больше в соответствии с текущей ситуацией