在controller.js文件中处理AngularJS中的错误

我有单页NodeJS + AngularJS应用程序。 有一些领域要填写文字。 在controller.js中,我想检查一个或多个字段是否为空,以便在浏览器中发送错误警报。

我的controller.js文件:

var myApp = angular.module('myApp', []); myApp.controller('AppCtrl', ['$scope', '$http', function($scope, $http) { console.log("Hello World from controller"); //$http.get('/builder').success(function(response){ // $scope.PEM = response; //}); $scope.sendParts = function(){ var bool = true; for(var prop in $scope.pem){ if(prop == 'undefined'){ bool = false; break; } if(bool){ $http.post('/builder', $scope.pem).success(function(response){ $scope.PEM = response; }); } else{ // why it is not working? alert("ERROR"); //OR $scope.PEM = "ERROR"; } } } }]); 

index.html文件:

 <!DOCTYPE> <html ng-app="myApp"> <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous"> <title>PEMbuilder</title> <style> .container { margin-left: 30%; margin-top: 5%; padding: 10px; background: #ffbf80; width: 390px; border: 2px solid #ffbf80; border-radius: 5px; } textarea { resize: vertical; } </style> </head> <body> <div class="container" ng-controller="AppCtrl"> <h1>PEMbuilder</h1> <h4><b>Name of project:</b></h4> <input class="data" ng-model="pem.name" type="text"> <h4><b>Certificate:</b></h4> <textarea rows="4" cols="50" class="data" ng-model="pem.crt" placeholder="Enter your certificate"></textarea> <h4><b>Intermediate:</b></h4> <textarea rows="4" cols="50" class="data" ng-model="pem.int" placeholder="Enter your intermediate"></textarea> <h4><b>Root:</b></h4> <textarea rows="4" cols="50" class="data" ng-model="pem.root" placeholder="Enter your root"></textarea> <h4><b>Private key:</b></h4> <textarea rows="4" cols="50" class="data" ng-model="pem.pk" placeholder="Enter your private key"></textarea> <h4><b>Password:</b></h4> <input class="data" ng-model="pem.pass" type="password"> <h4><button class="btn btn-primary" ng-click="sendParts()">Create full certificate</button></h4> <h4><button class="btn btn-primary" onclick="window.location.href = '/download';">Download full certificate</button></h4> <h3 style="color: red">{{err}}</h3> <a onclick="$('#text').slideToggle('slow');" href="javascript://">Show/Hide full pem file</a> <div id="text" style="display:none; white-space: pre-wrap; word-wrap: break-word; -moz-control-character-visibility: visible;">{{PEM}}</div> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.0/angular.min.js'></script> <script src='controllers/controller.js'></script> </body> </html> 

所以我想以某种方式处理,如果任何领域是空的。 应用的屏幕截图

请注意,当没有字段input文本$scope.pem是未定义的。 一旦至less有一个领域有文字input,模型被定义。 一个快速的工作将是检查$scope.pem === undefined ,如果这个条件是真的,提出一个警报。

 var myApp = angular.module('myApp', []); myApp.controller('AppCtrl', ['$scope', '$http', function($scope, $http) { $scope.sendParts = function(){ if($scope.pem === undefined) alert("I have no fields filled out") var bool = true; for(var prop in $scope.pem){ if(prop == 'undefined'){ bool = false; break; } if(bool){ } else{ // why it is not working? alert("ERROR"); //OR $scope.PEM = "ERROR"; } } } }]); 

你需要注入$窗口到你的控制器,并像这样使用它:

 $window.alert("ERROR"); 

$ window(angularjs doc)