angularjs - El evento ng-click no se activa al hacer clic en el botón?

ng-click function

Question

Estoy creando una aplicación web en Angularjs. Escribo el código en un archivo .js separado para iniciar sesión desde la base de datos. Se ejecuta al cargar la página, pero no se activa al hacer clic en el botón, mi código .js es:

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

y mi opinión es que lo que estoy usando para unir esto usando Angularjs aquí es un problema que el código está trabajando en la carga de la página pero no funciona con el clic del botón, el código que uso es:

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

Por favor, por favor, ayúdenme lo que echo de menos aquí, así que no puedo activar el evento ng-click en el botón clic gracias de antemano.

Answer 1

Su función de Login debe estar en un alcance. En este momento, es esencialmente una función privada:

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

Answer 2

asignar función a una variable de ámbito.

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

Editado:

Trate de usar este código html, pero no estoy seguro. Puede ser que tanto ng-init como ng-controller estén en la misma carga div y ng-controller primero después de ese 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>