Question

我在Angularjs中创建Web应用程序我在单独的.js文件中编写代码，以便从数据库登录是在页面加载时执行但在按钮点击时不触发，我的.js代码是：

   var adminModule = angular.module('angApp', []);
   //Defining a Angular Controller
   adminModule.controller('AdminCtrl', ['$scope', '$http',
  `enter code here` function ($scope, $http) {
    Login();
           function Login(U_Name, U_PWD) {
        debugger;
        //Defining the $http service for login the admin user
        $http({
            method: 'POST',
            url: '/Admin/IsAuthenticate',
            data: { User_Name: U_Name, User_PWD: U_PWD }
        }).success(function (result) {

            if (result == true) {
                alert('user is valid');
            }
            else {
                alert('unauthorised access!');
            }
        })
            .error(function (error) {
                //Showing error message 
                $scope.status = 'Unable to connect' + error.message;
            });
    }
       }]);

我的观点是我在这里使用Angularjs绑定它的问题是上面的代码正在处理页面加载，但是在点击按钮时不起作用，我使用的代码是：

 <div class="admin-login" ng-controller="AdminCtrl" ng-app="angApp">
     <h2>using angularjs</h2>
    <input type="text" id="txtUserAng" placeholder="User Name" ng-model="U_Name" />
    <input type="password" id="txtPWDAng" placeholder="Password" ng-model="U_PWD"  />
    <input type="button" id="login" value="login" ng-click="Login()" />
</div>

任何人都可以帮助我，我想念的是什么，所以我无法在点击按钮时触发ng-click事件提前谢谢。

Answer 1

您的Login功能需要在范围内。现在，它本质上是一个私人功能：

$scope.Login = function () {
  ...
}

Answer 2

将函数赋值给范围变量。

 var adminModule = angular.module('angApp', []);
   //Defining a Angular Controller
   adminModule.controller('AdminCtrl', ['$scope', '$http',
   function ($scope, $http) {

           $scope.Login=function (U_Name, U_PWD) {
        debugger;
        //Defining the $http service for login the admin user
        $http({
            method: 'POST',
            url: '/Admin/IsAuthenticate',
            data: { User_Name: U_Name, User_PWD: U_PWD }
        }).success(function (result) {

            if (result == true) {
                alert('user is valid');
            }
            else {
                alert('unauthorised access!');
            }
        })
            .error(function (error) {
                //Showing error message 
                $scope.status = 'Unable to connect' + error.message;
            });
    }
       $scope.Login();
       }]);

<强>编辑：

尝试使用这个html代码，但我不确定。在ng-init之后，ng-init和ng-controller都可以在同一个div和ng-controller中加载：

<div ng-app="angApp">
  <div class="admin-login" ng-controller="AdminCtrl" >
     <h2>using angularjs</h2>
    <input type="text" id="txtUserAng" placeholder="User Name" ng-model="U_Name" />
    <input type="password" id="txtPWDAng" placeholder="Password" ng-model="U_PWD"  />
    <input type="button" id="login" value="login" ng-click="Login()" />
  </div>
</div>

单击按钮时是否触发了ng-click事件？

2 个答案: