Question

我真的很喜欢棱角分明，但反应却引起了很多关注。他们真的是对立的力量吗？

一起使用反应和角度是一个好主意吗？我可否？ 我应该吗？

混合它们的优点和缺点是什么？

React用于UI，但angular可以处理控制器和视图......但是在处理视图时反应更好吗？我们可以通过仅将角度降级到控制器来制作更好的应用程序吗？

做这些事情有什么好的资源吗？

我喜欢角度的一件事似乎不那么真实的反应是角度真的允许你分离关注点，而反应开始混淆这一点。这似乎与角度方式相反，至少。

Answer 1

他们真的是对立的力量吗？

从某种意义上说，它们是，而在某种意义上，它们并非如此。人们肯定在Angular指令中使用React，但他们主要是为了获得性能提升，而不是因为他们认为React很棒。如果您仅仅考虑React以获得更好的性能，那么您真的错过了React的价值主张。

我会说他们是对立的力量，因为他们解决了同样的问题。尽管React只是MVC和Angular中的V的论点是一个完整的框架＆＃34;被大量抛出，Angular和React非常具有可比性。

Angular有控制器和指令（以及服务和工厂），而React只有组件。因此，当Angular成为一个更完整的框架时，很容易理解。但是让我们解读一下。

<强>控制器

React不包含任何称为Controller的东西，但React世界中有一个名为＆＃34; view controller＆＃34;的概念，它可以很好地映射到Angular控制器。反应＆＃34;视图控制器＆＃34;被定义为任何其他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视图组件。

服务和工厂

这是Angular中存在的东西，因为它具有依赖注入的概念，并且基本上是＆＃34; Angular的唯一参数是比React＆＃34;更完整的框架。如果Angulars的DI方式非常适合像Javascript这样的语言，你可以争辩好几天，如果Javascript真的需要类似它的东西，因为它很有活力，但是不要这样做。

而不是像Angular那样创建自己的模块系统（而且我认为我们都同意Angular模块本身添加的价值很小），React允许您使用任何您喜欢的模块系统。透明的ES6，CommonJS，AMD，普通的老式全局等。社区几乎同意ES6和CommonJS，这是一件好事（Angular正朝着Angular 2的方向发展）。

因此，如果你的DI是你的东西，它很容易与一个好的模块系统一起实现。在Pete Hunt的React中，甚至有一个非常有趣的方法来对DI进行全新的处理：http://jsfiddle.net/cjL6h/

一起使用反应和角度是一个好主意吗？我可否？应该我？

如果您计划转移到React线上，我只会这样做。您的应用程序将更难理解且更复杂，因为您必须同时了解Angular和React。也就是说，很多人似乎都在Angular中使用React，所以这只是我的观点。

React用于UI，但angular可以处理控制器和查看......但是在处理视图时反应更好吗？我们能做得更好吗？应用程序只将角度降级到控制器？

就像我之前说过的，这是一种常见的误解。 Angular和React以不同的方式解决了同样的问题。不将业务逻辑层绑定到Angular模块系统的好处是，它更容易迁移到其他东西。一小部分人使用Flux架构和React，但没有任何特定的反应与Flux。您可以在任何框架中使用Flux创意。

我喜欢角度的一件事似乎不那么真实反应是角度确实让你分离关注，而反应开始混淆这一点。好像至少与角度方式相反。

我非常不同意这一点。我发现我的React应用程序比我的Angular应用程序更好地分离了关注点（我已经使用了很多Angular）。您只需了解React的思维方式，了解Flux的全部内容也是一个好主意。我并不是说你不能在Angular中编写优秀的应用程序，只是我的经验，它更容易陷入成功的陷阱。使用React而不是使用Angular。

Angular有两步学习曲线。首先，您创建一个带有作用域的控制器，向作用域添加一个数组并使用ng-repeat打印出来，并且您会对它的简单程度感到惊讶。你添加一个更难掌握的指令，但你复制并粘贴它并且它有效。 Yeay！然后当你深入挖掘时，你会在你的学习曲线中迈出第二步，你必须开始真正理解Angular的内部结构。您必须知道范围继承原型继承及其后果（在所有ng-model表达式中需要一个点等）。指令控制器有什么用？它们是什么以及它们与常规控制器相比如何？什么是翻转？有人告诉我，我需要在我的指令的编译步骤中执行此操作，那是什么？

使用React，初始学习曲线有点陡峭。但是一旦你完成它，就没有第二步了。学习流程可以被认为是第二步，但学习流程可以为您提供新的知识，这些知识可以转移到其他Javascript框架，这是Angular指令中的＆＃34;编译步骤＆＃34;没有。

React对Angular的另一大优势是它主要只是Javascript。 React元素上的属性只是Javascript对象/函数，而不是像Angular属性中的魔术字符串。这也意味着您的常规短信可以告诉您回调属性表达式是否存在错误。在Angular中，您必须运行代码以查看它是否有效。

由于Javascript已经具有块范围，因此您不必担心为元素名称添加前缀，使其具有唯一性。

所以我说，Angular毫无价值，你应该转向React？不，我不是。很多公司在Angular上投入了大量资金。但是如果你问我，Angular中有更多的怪癖和怪异，你真的要知道如果你要构建一个可维护的应用程序。您还应该考虑Angular 2是一个完全重写的事实，它从React中获得了很多灵感（这很棒！）。

Answer 2

是的，你可以像@Edward Knowles所说，你应该使用directives来使用React。虽然您可以使用ngReact，但您也可以轻松创建指令以使用React。

在Angular中，指令是将“View Oriented”组件集成到角度应用程序的最佳方式，React是一个面向表示/视图层的框架。

由于React使用选择器来追加和渲染页面的某些部分，因此您可以创建一个在角度内工作的指令，其方式如下：

您通过services和controllers （服务和数据层）
然后，directive接收并可能操纵该数据（模型层的种类）
然后directive调用React并传递信息，以便使用React方便的功能正确呈现您的信息。（查看图层）

对于Angular + React + D3的集成，这是一个非常简短的video，用于创建基本图表。

Answer 3

是的，您可以使用指令ngReact。有一些用例你可能想要这样做，但是今年夏天Angular 2即将推出，我会坚持尝试实现它。

至于速度，你应该在今年早些时候的ng-conf期间观看this精彩的演讲。

Answer 4

如果你发现自己一起使用Angular和React，https://github.com/bcherny/ngimport是两者之间非常好的桥梁。它允许您像在任何其他代码中一样import / require在Angular和外部世界之间共享服务/提供者/工厂/值/常量。希望这有帮助！

Answer 5

Extjs是当代的，如果不能直接替代React和Angular。一个切线的答案是看一下ExtReact。 ExtReact是ExtJs尝试与React配合良好的尝试。这样做的好处是Extjs应用程序中React组件的可重用性。

Answer 6

只是一个想法：是的，我们可以在单个项目中同时使用这两个项目，但这对学习很有帮助，但根据当前情况，该项目难以维护且成本较高

角度和反应可以一起玩吗？

6 个答案: