Angular js应用程序显示语法错误

时间:2018-01-03 07:24:49

标签: javascript angularjs wcf

我正在将wcf服务用于angular js应用程序。我试图从角度js应用程序调用多个请求到wcf服务。但问题是,当我运行应用程序时,我在谷歌Chrome控制台窗口中出现以下错误。

参数列表

之后

未捕获的SyntaxError:missing)

未捕获错误:[$ injector:modulerr] http://errors.angularjs.org/1.6.5/ $ injector / modulerr?

这是脚本代码。

///// <reference path="../angular.min.js" />  



var app = angular.module("WebClientModule", [])

    .controller('Web_Client_Controller', ["$scope", 'myService', function ($scope, myService) {

        $scope.OperType = 1;

        //1 Mean New Entry  

        //To Clear all input controls.  
        function ClearModels() {

            $scope.OperType = 1;
            $scope.Tittle = "";
            $scope.First_Name = "";
            $scope.Last_Name = "";
            $scope.Gender = "";
            $scope.DOB = "";
            $scope.Mobile = "";
            $scope.House_No = "";

            $scope.Streent_Name = "";
            $scope.Country = "";
            $scope.Post_Code = "";
            $scope.Occupation = "";

        }
        $scope.CeditCardApplication = function () {
            var ApplicationDeatils = {
                Tittle: $scope.Tittle,
                First_Name: $scope.First_Name,
                Last_Name: $scope.Last_Name,
                Gender: $scope.Gender,
                DOB: $scope.DOB,
                Mobile: $scope.Mobile,
                House_No: $scope.House_No,
                Streent_Name: $scope.Streent_Name,
                Country: $scope.Country,
                Post_Code: $scope.Post_Code,
                Occupation: $scope.Occupation
            };
            myService.ApplicationDeatilsCheck(ApplicationDeatils).then(function (pl) {
                console.log(pl.data)
                if (pl.data) {
                    $scope.msg = "User information is correct  !"

                    myService.ApplicationCreditScoreCheck(ApplicationDeatils1).then(function (p2) {
                        console.log(p2.data)

                        if (p2.data) {

                            $scope.msg = "We can offer you £6000";

                        }

                        else {
                            $scope.msg = "Application failed !";
                            console.log("Some error Occured" + err);
                        }
                    }, function (err) {
                        $scope.msg = "Application failed!";
                        console.log("Some error Occured" + err);
                    });
                };

            }

    }]);



app.service("myService", function ($http) {



    this.ApplicationDeatilsCheck = function (ApplicationDeatils) {
        return $http.post("http://localhost:52098/HalifaxIISService.svc/CreateCurrentAccountCheck", JSON.stringify(ApplicationDeatils));
    }
    this.ApplicationCreditScoreCheck = function (ApplicationDeatils) {
        return $http.post("http://localhost:52098/HalifaxIISService.svc/cheekCreditScore", JSON.stringify(ApplicationDeatils));
    }




})

这是HTML CODE ..

@{
    Layout = null;
}

<!DOCTYPE html>

<html ng-app="WebClientModule">
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <script src="~/Scripts/angular.min.js"></script>
    <script src="~/CreditCardApplicationScript/ApplicationCheck.js"></script>

</head>

<body >

    <table id="tblContainer" data-ng-controller="Web_Client_Controller">
        <tr>
            <td></td>
        </tr>
        <tr>
            <td>
                <table style="border: solid 4px Red; padding: 2px;">

                    <tr>
                        <td></td>
                        <td>
                            <span>Tittle</span>
                        </td>
                        <td>
                            <input type="text" id="Tittle" data-ng-model="Tittle" required="" />
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <span>Fisrt Name</span>
                        </td>
                        <td>
                            <input type="text" id="first_name" required data-ng-model="First_Name" require="" />
                        </td>
                    </tr>

                    <tr>
                        <td></td>
                        <td>
                            <span>Last Name</span>
                        </td>
                        <td>
                            <input type="text" id="last_name" data-ng-model="Last_Name" required="" />
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <span>Gender</span>
                        </td>
                        <td>
                            <input type="text" id="gender" required data-ng-model="Gender" require="" />
                        </td>
                    </tr>

                    <tr>
                        <td></td>
                        <td>
                            <span>Date Of Brith</span>
                        </td>
                        <td>
                            <input type="text" id="dob" data-ng-model="DOB" required="" />
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <span> Moblie/Telephone No</span>
                        </td>
                        <td>
                            <input type="text" id="mobile" required data-ng-model="Mobile" require="" />
                        </td>
                    </tr>

                    <tr>
                        <td></td>
                        <td>
                            <span> House No/Door No</span>
                        </td>
                        <td>
                            <input type="text" id="house_no" required data-ng-model="House_No" require="" />
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <span> Streent Name</span>
                        </td>
                        <td>
                            <input type="text" id="streent_name" required data-ng-model="Streent_Name" require="" />
                        </td>
                    </tr>

                    <tr>
                        <td></td>
                        <td>
                            <span> Country</span>
                        </td>
                        <td>
                            <input type="text" id="country" required data-ng-model="Country" require="" />
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <span> Post Code</span>
                        </td>
                        <td>
                            <input type="text" id="post_code" required data-ng-model="Post_Code" require="" />
                        </td>
                    </tr>

                    <tr>
                        <td></td>
                        <td>
                            <span> Occupation</span>
                        </td>
                        <td>
                            <input type="text" id="occupation" required data-ng-model="Occupation" require="" />
                        </td>
                    </tr>




                    <tr>
                        <td></td>
                        <td></td>
                        <td>
                            <input type="button" id="CeditCardApplication" value="CeditCardApplication" data-ng-click="CeditCardApplication()" />
                        </td>
                    </tr>
                </table>
                <div style="color: red;">{{msg}}</div>

            </td>
        </tr>
    </table>
</body>
</html>

以下是我运行应用程序时的屏幕截图.. enter image description here

1 个答案:

答案 0 :(得分:1)

错误是正确的,您错过了)字符和}。这里的代码格式更好一点,以便于阅读:

var app = angular.module("WebClientModule", [])

.controller('Web_Client_Controller', ["$scope", 'myService', function ($scope, myService) {

  $scope.OperType = 1;

  //1 Mean New Entry  

  //To Clear all input controls.  
  function ClearModels() {
    $scope.OperType = 1;
    $scope.Tittle = "";
    $scope.First_Name = "";
    $scope.Last_Name = "";
    $scope.Gender = "";
    $scope.DOB = "";
    $scope.Mobile = "";
    $scope.House_No = "";

    $scope.Streent_Name = "";
    $scope.Country = "";
    $scope.Post_Code = "";
    $scope.Occupation = "";
  }
  $scope.CeditCardApplication = function () {
    var ApplicationDeatils = {
      Tittle: $scope.Tittle,
      First_Name: $scope.First_Name,
      Last_Name: $scope.Last_Name,
      Gender: $scope.Gender,
      DOB: $scope.DOB,
      Mobile: $scope.Mobile,
      House_No: $scope.House_No,
      Streent_Name: $scope.Streent_Name,
      Country: $scope.Country,
      Post_Code: $scope.Post_Code,
      Occupation: $scope.Occupation
    };
    myService.ApplicationDeatilsCheck(ApplicationDeatils).then(function (pl) {
      console.log(pl.data)
      if (pl.data) {
        $scope.msg = "User information is correct  !"

        myService.ApplicationCreditScoreCheck(ApplicationDeatils1).then(function (p2) {
            console.log(p2.data)

            if (p2.data) {

              $scope.msg = "We can offer you £6000";

            } else {
              $scope.msg = "Application failed !";
              console.log("Some error Occured" + err);
            }
        }, function (err) {
            $scope.msg = "Application failed!";
            console.log("Some error Occured" + err);
        });
      };

    }); // <-- missing )
  } // <-- missing }
}]);



app.service("myService", function ($http) {

  this.ApplicationDeatilsCheck = function (ApplicationDeatils) {
    return $http.post("http://localhost:52098/HalifaxIISService.svc/CreateCurrentAccountCheck", JSON.stringify(ApplicationDeatils));
  }
  this.ApplicationCreditScoreCheck = function (ApplicationDeatils) {
    return $http.post("http://localhost:52098/HalifaxIISService.svc/cheekCreditScore", JSON.stringify(ApplicationDeatils));
  }

});

这是缩进和代码可读性非常重要的时代之一。