Angular JS 应用程序无法从 Wcf Service 返回 Mesaage

我正在使用 WCF Service 到 Angular JS 应用程序中。我的 Wcf 服务工作正常，我的 Angular JS 应用程序能够使用 wcf 服务，但我面临一个问题。我在脚本文件中有一个名为 $scope.msg 的变量。在这里，如果用户名和密码正确，我想将用户重定向到下一页，否则如果用户名或密码不正确，那么我想显示佩戴用户名或密码的消息。我在谷歌浏览器的控制台应用程序中收到此错误，我想将其重新加载到 Chorme 控制台应用程序中

，但不能。.

这是脚本代码..

///// <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.Username = "";
            $scope.Password = "";

        }

        $scope.login = function () {
            var User = {
                Username: $scope.Username,
                Password: $scope.Password,

            };
               myService.AuthenticateUser(User).then(function (pl) {
                    $scope.msg = "Username and password is correct ";

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

        };

    }]);
app.service("myService", function ($http) {
    // Create new record  
    this.AuthenticateUser = function (User) {
        return $http.post("http://localhost:52098/HalifaxIISService.svc/AuthenticateUser", JSON.stringify(User));
    }
})

这是HTML代码。

@{
    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="~/RegistrationScript/LoginScript.js"></script>
</head>
<body>
    <table id="tblContainer" data-ng-controller="Web_Client_Controller">
        <tr>
            <td>
            </td>
        </tr>
        <tr>
            <td>
                <div style="color: red;">{{Message}}</div>
                <table style="border: solid 4px Red; padding: 2px;">
                    <tr>
                        <td></td>
                        <td>
                            <span>Username</span>
                        </td>
                        <td>
                            <input type="text" id="username" data-ng-model="Username" required="" />
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <span>Password</span>
                        </td>
                        <td>
                            <input type="password" id="password" required data-ng-model="Password" require="" />
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td></td>
                        <td>
                            <input type="button" id="Login" value="Login" data-ng-click="login()" />
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>
</html>
<script src="~/RegistrationScript/LoginScript.js"></script>

据我了解，在此行添加if语句，但我不确定将在哪里添加此语句..

 myService.AuthenticateUser(User).then(function (pl) {
                    $scope.msg = "Username and password is correct ";

问题是您错过了在 html 中包含错误消息显示代码。所以你可以像

<div>
    {{msg}}
</div>

这里是你完整的 html 代码

@{
    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="~/RegistrationScript/LoginScript.js"></script>
</head>
<body>
    <table id="tblContainer" data-ng-controller="Web_Client_Controller">
        <tr>
            <td></td>
        </tr>
        <tr>
            <td>
                <div style="color: red;">{{msg}}</div>
                <table style="border: solid 4px Red; padding: 2px;">
                    <tr>
                        <td></td>
                        <td>
                            <span>Username</span>
                        </td>
                        <td>
                            <input type="text" id="username" data-ng-model="Username" required="" />
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <span>Password</span>
                        </td>
                        <td>
                            <input type="password" id="password" required data-ng-model="Password" require="" />
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td></td>
                        <td>
                            <input type="button" id="Login" value="Login" data-ng-click="login()" />
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>
</html>
<script src="~/RegistrationScript/LoginScript.js"></script>

相关内容

最新更新

热门标签：