Angular 中的缩小
什么是缩小?
这是从源代码中删除所有不必要的字符而不更改其功能的过程。
普通语法
如果我们使用普通的角度语法来编写控制器,那么在微调我们的文件之后它将破坏我们的功能。
控制器(缩小前):
var app = angular.module('mainApp', []);
app.controller('FirstController', function($scope) {
$scope.name= 'Hello World !';
});
使用缩小工具后,将如下所示缩小。
var app=angular.module("mainApp",[]);app.controller("FirstController",function(e){e.name= 'Hello World !'})
这里,minification 从代码中删除了不必要的空格和$ scope 变量。因此,当我们使用这个缩小的代码时,它不会在视图上打印任何内容。因为$ scope 是控制器和视图之间的关键部分,现在它被小的’e’变量取代。因此,当你运行应用程序时,它将给出未知提供程序’e’依赖性错误。
有两种方法可以使用服务名称信息来注释你的代码,这些信息是安全的最小化:
内联注释语法
var app = angular.module('mainApp', []);
app.controller('FirstController', ['$scope', function($scope) {
$scope.message = 'Hello World !';
}]);
$ inject 属性注释语法
FirstController.$inject = ['$scope'];
var FirstController = function($scope) {
$scope.message = 'Hello World !';
}
var app = angular.module('mainApp', []);
app.controller('FirstController', FirstController);
缩小后,此代码将是
var app=angular.module("mainApp",[]);app.controller("FirstController",["$scope",function(a){a.message="Hello World !"}]);
这里,angular 将变量’a’视为$ scope,它将输出显示为’Hello World!’。