TL；DR:AngularJS 1.5+已经进行了重大更新。在本文中，您将学习如何使用基于组件的体系结构开发AngularJS应用程序，并利用API更改来帮助您以角度（v2+）样式编写AngularJS应用程序。目前，基于组件的体系结构在前端开发中非常流行。JavaScript客户端框架，如React、Preact、Ember，什么是大数据概念，Vue.js版所有人都主张在组件中构建应用程序。AngularJS的主要重写版本AngularJS（v2+）也是AngularJS的主要重写版本，它完全基于组件。"如今，基于组件的体系结构在前端开发中非常流行。"在推特上留言应用组件体系结构构建的应用程序的一个典型示例是将应用程序的几个特性开发为具有可重用组件的模块。例如，让我们使用一个音乐播放器应用程序。此产品所需的功能可能是音乐播放器小部件。以基于组件的架构风格设计应用程序的开发人员可以将此功能建模为模块。我们称之为音乐播放器小部件模块。在模块内部，我们可以有以下组件：音乐搜索组件，。音乐播放列表组件，。当前正在播放的歌曲组件，。在基于组件的体系结构中，我们通常有父组件和子组件。上面提到的三个单独的组件可以称为子组件，这些子组件封装在一个大组件中，称为父组件或根组件。AngularJS.component（）方法AngularJS团队在AngularJS 1.5中引入了.component（）方法。这种方法允许开发人员使用基于组件的体系结构编写应用程序。如何使用.component（）？在Angular 1.5之前，我们只有指令、角度指令，比如ngHide、ngHref、ngRepeat和custom指令。指令是一个独特而强大的功能，允许您创建自定义的类似HTML的标记，具体到您的应用程序。在本文中，我们将检查一个指令，并使用.component（）方法将其转换为组件。指令是一种独特而强大的功能，大数据查询，允许您创建自定义的类似HTML的标记，特定于您的应用程序在推特上留言角度模块（"教程"，[]）.directive（'abacus'，函数abacus（）{返回{作用域：{}，绑定控制器：{计数：'='},控制器：功能（）{函数增量（）{这个。计数++;}函数减量（）{这个。计数--;}这个增量=增量；这个。减量=减量；},controllerAs:'算盘'，模板：`

+

`};});将指令转换为组件的第一步是将.directive（）更改为.component（）。指令.directive（'abacus'，函数abacus（）{返回{};});成分.component（'abacus'，返利宝，函数abacus（）{});又好又简单。本质上，.directive（）中的return{}；语句成为.component（）中的对象定义。令人惊叹的！绑定在.directive（）中，scope属性允许我们定义是要隔离$scope还是继承它，现在这已成为一个明智的默认值，使我们的指令始终具有隔离的作用域。所以每次重复我们自己只会造成过多的样板。通过引入bindToController，我们可以显式地定义要传递到隔离范围中的属性，并直接绑定到控制器。使用.component（）上的bindings属性，我们可以删除这个样板文件，并简单地定义要传递给组件的内容，前提是组件将具有一个独立的作用域。//以前.directive（'abacus'，函数abacus（）{返回{作用域：{}，绑定控制器：{计数：'='}};});//之后.component（'abacus'{绑定：{计数：'='}});重构控制器功能我们声明controller的方式没有任何改变，但是它现在更聪明了一点，默认的controllerAs值是$ctrl。如果我们使用组件的本地控制器，我们将执行以下操作：//1.4条{...控制器：函数（）{}...}如果使用其他地方定义的控制器，我们将执行以下操作：//1.4条{..."SomeController:"SomeController'...}如果要在此阶段定义controllerAs，则需要创建新属性并定义实例别名：//1.4条{...controller:'SomeCtrl'，controllerAs:'虚拟机'...}这样我们就可以使用虚拟机标题在我们的模板中与控制器的实例进行对话。在AngularJS 1.5中，我们可以在inside.component（）中执行以下操作：//1.5条{...controller:'SomeCtrl as vm'...}这有助于我们通过防止使用controllerAs属性来最小化代码。但是，我们可以添加controllerAs属性来保持向后兼容性，或者如果您的风格适合编写指令或组件，则可以保留它。还有一个选项完全不需要controllerAs，Angular会自动使用属性$ctrl。例如：.component（'bet'{控制器：功能（）{这个.betNumber=777个；}});在上面的代码中，没有controllerAs属性。在我们的模板中，微信返利机器人，云市场，controller默认为$ctrl，因此我们可以使用$ctrl.betNumber.由于不需要controllerAs属性，我们只需将指令重构为如下组件：//以前.directive（'abacus'，函数abacus（）{返回{作用域：{}，绑定控制器：{计数：'='},控制器：功能（）{函数增量（）{这个。计数++;}函数减量（）{这个。计数--;}这个增量=增量；这个。减量=减量；},controllerAs:'算盘'};});//之后.component（'abacus'{绑定：{计数：'='},控制器：功能（）{函数增量（）{这个。计数++;}函数减量（）{这个。计数--;}这个增量=增量；这个。减量=减量；}});模板化更改请看下面的代码，以及模板属性是如何定义的。.component（'abacus'{绑定：{计数：'='},控制器：功能（）{函数增量（）{这个。计数++;}函数减量（）{这个。计数--;}这个增量=增量；这个。减量=减量；},模板：`