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

时间:2021-10-19 12:16:10

i'm creating web application in Angularjs i write code in separate .js file for log in from database is is execute on page load but not triggering on button click, my .js code is:

我在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;
            });
    }
       }]);

and my view as what i'm using for binding this using Angularjs here is an issue above code is working on page load but don't work on button click, the code i use is:

我在这里使用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>

anyone please help me what i miss here so i'm not able to trigger ng-click event on button click thanks in advance.

任何人请帮助我,我想念这里,所以我无法提前点击按钮点击触发ng-click事件。

2 个解决方案

#1


14  

Your Login function needs to be on a scope. Right now, its essentially a private function:

您的登录功能需要在范围内。现在,它本质上是一个私人功能:

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

#2


3  

assign function to a scope variable.

将函数赋给范围变量。

 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();
       }]);

Edited:

编辑:

try to use this html code,but i am not sure.it may be that both ng-init and ng-controller are in same div and ng-controller load first after that ng-init :

尝试使用这个HTML代码,但我不确定。可能是ng-init和ng-controller都在同一个div和ng-controller首先加载ng-init之后:

<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>

#1


14  

Your Login function needs to be on a scope. Right now, its essentially a private function:

您的登录功能需要在范围内。现在,它本质上是一个私人功能:

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

#2


3  

assign function to a scope variable.

将函数赋给范围变量。

 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();
       }]);

Edited:

编辑:

try to use this html code,but i am not sure.it may be that both ng-init and ng-controller are in same div and ng-controller load first after that ng-init :

尝试使用这个HTML代码,但我不确定。可能是ng-init和ng-controller都在同一个div和ng-controller首先加载ng-init之后:

<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>