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

【问题标题】：Handle error in AngularJS in controller.js file在 controller.js 文件中处理 AngularJS 中的错误
【发布时间】：2016-06-07 09:18:51
【问题描述】：

我有单页 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>

所以如果任何字段为空，我想以某种方式处理。 screenshot of app

【问题讨论】：

查看 ngForm 和自定义验证器
您是否已逐步检查代码以确保“布尔”实际上是错误的？另外，我看不到 $scope.pem 的启动位置。最后，您指的是 $scope.pem 和 $scope.PEM。
$scope.pem 在您至少有一个输入字段之前不会被定义。一个简单的解决方法是最初设置var bool = $scope.pem。不过我建议你也看看 ngForm

标签： html angularjs node.js

【解决方案1】：

请注意，当没有字段输入文本时，$scope.pem 未定义。一旦至少一个字段具有文本输入，就定义了模型。一个快速的解决方法是检查 $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";
            }
        }
    }
}]);

【讨论】：

请查看ngForm

【解决方案2】：

您需要将 $window 注入您的控制器，并像这样使用它：

$window.alert("ERROR");

$window (angularjs doc)

【讨论】：