缩小时打破我AngularJs code [英] Minification is breaking my AngularJs code
问题描述
我使用它使用微软的Ajax Minifier来缩小JS盒。这minifier重命名变量,包括具有特殊意义的角度变量,如 $范围
和 $ HTTP
。所以盒式打破我的角度code!
我如何prevent出现这种情况?
有关参考,这是角code正在被打破。在 $范围
和 $ HTTP
函数参数被重命名为:
//<参考路径=供应商/ angular.js/>angular.module('帐户模块,[])
.controller('ForgottenPasswordController',函数($范围,$ HTTP){ $ scope.email = {
值:'',
isValid方法:假的,
containerStyle:未验证,
验证:功能(){
VAR有效= isEmailAdressValid($ scope.email.value);
$ scope.email.isValid =有效;
$ scope.email.containerStyle =有效吗? 有效:无效;
返回有效的;
},
removeErrorMessage:功能(){
$ scope.email.containerStyle =未验证;
}
}; $ scope.display = {
formClass:'',
congratulationsClass:隐藏
}; $ scope.submit =函数(事件){
。事件preventDefault(); 变种emailValid = $ scope.email.validate();
如果(emailValid){
$ HTTP({
方法:POST,
网址:'/帐号/忘记密码,
PARAMS:{电子邮件:$ scope.email.value},
标题:{内容类型:应用程序/ x-WWW的形式urlen codeD'}
})。成功(功能(数据){
$ scope.success(数据);
})错误(函数(){$ scope.error();});
}
}; $ scope.success =功能(数据){
开关(data.Outcome){
情况1:
$ scope.display.formClass =隐藏;
$ scope.display.congratulationsClass =;
打破;
案例2:
$ scope.email.containerStyle =无效;
打破;
}
}; $ scope.error =功能(){
警报('对不起,发生了错误。');
}; 功能isEmailAdressValid(EMAILADDRESS){
返回/[^\\s@]+@[^\\s@]+\\.[^\\s@]+/.test(emailAddress);
}
});
要prevent code minifiers,你必须使用数组语法定义控制器。
看<一个href=\"http://odeto$c$c.com/blogs/scott/archive/2013/03/13/angularjs-controllers-dependencies-and-minification.aspx\">http://odeto$c$c.com/blogs/scott/archive/2013/03/13/angularjs-controllers-dependencies-and-minification.aspx
(从OP):
作为参考,这里是改变code:
angular.module('帐户模块,[])
.controller('ForgottenPasswordController',[$范围,$ HTTP功能($范围,$ HTTP){
...
}]);
I'm using Cassette which uses the Microsoft Ajax Minifier to minify JS. This minifier renames variables, including variables that have special meaning to Angular, such as $scope
and $http
. So Cassette breaks my Angular code!
How can I prevent this happening?
For reference, this is the Angular code which is being broken. The $scope
and $http
function parameters are being renamed:
// <reference path="vendor/angular.js" />
angular.module('account-module', [])
.controller('ForgottenPasswordController', function ($scope, $http) {
$scope.email = {
value: '',
isValid: false,
containerStyle: "unvalidated",
validate: function () {
var valid = isEmailAdressValid($scope.email.value);
$scope.email.isValid = valid;
$scope.email.containerStyle = valid ? "valid" : "invalid";
return valid;
},
removeErrorMessage: function() {
$scope.email.containerStyle = "unvalidated";
}
};
$scope.display = {
formClass: '',
congratulationsClass: 'hide'
};
$scope.submit = function (event) {
event.preventDefault();
var emailValid = $scope.email.validate();
if (emailValid) {
$http({
method: 'POST',
url: '/account/forgot-password',
params: { email: $scope.email.value },
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).success(function(data) {
$scope.success(data);
}).error(function() { $scope.error(); });
}
};
$scope.success = function (data) {
switch (data.Outcome) {
case 1:
$scope.display.formClass = "hide";
$scope.display.congratulationsClass = "";
break;
case 2:
$scope.email.containerStyle = "invalid";
break;
}
};
$scope.error = function () {
alert('Sorry, an error occurred.');
};
function isEmailAdressValid(emailAddress) {
return /[^\s@]+@[^\s@]+\.[^\s@]+/.test(emailAddress);
}
});
To prevent code minifiers from destroying your angular application, you have to use the array syntax to define controllers.
(From OP): For reference, here is the changed code:
angular.module('account-module', [])
.controller('ForgottenPasswordController', ["$scope", "$http", function ($scope, $http) {
...
}]);
这篇关于缩小时打破我AngularJs code的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!