angular 1.5 新增了组件功能,一个简单的组件要包括两项:模板、控制器。
1、模板,可以是一段html内容,也可以是引用html文件的路径
2、控制器,则跟我们的 controller 的使用大致相同。
<!DOCTYPE html> <html ng-app="myApp"> <head> <meta charset="UTF-8"> <script src="angular.js"></script> </head> <body> <test-compnent></test-component> <script> angular.module('myApp', []) .component('testComponent', { template: "<h3>{{$ctrl.sayHello}}</h3>", controller: TestComponent }) function () { this.sayHello = 'Hello'; } </script> </body> </html>
组件中推荐使用 this 来定义变量。页面中通过 $ctrl.变量名 的方式进行引用。
1.5 的 component 中也是支持 $scope 的,其他服务什么的跟 controller 中使用相同。不过 $scope 在 angular 的高级版本中会被移除~