How to get input values in AngularJS scope?

Question

The $scope.UserName and $scope.Password aren't getting the values from the HTML input fields.

Here is the script code:

var cs = angular.module('csw', []);    
cs.controller('login', ['$scope', function($rootScope, $scope, $http) {
    $scope.showLogin=true;
    $http.post('http://localhost:8080/csw/rest/cs/admin/login?userName=' + $scope.UserName + '&password=' + $scope.Password)  
}]);

This is the HTML:

<div ng-app="csw">
    <!-- login -->
    <div ng-controller="login" ng-show="showLogin" style="border: 2px solid black">
        <p>
            UserName: <input type="text" ng-model="UserName" value="admin">
            Password: <input type="text" ng-model="Password" value="1234">        
        </p>
        <hr/>
    </div>
</div>

score 1 · Accepted Answer · answered Mar 05 '16 at 12:04

Your controller declaration is incorrect:

cs.controller('login',['$scope', function($rootScope, $scope, $http) {

should be

cs.controller('login',['$rootScope', '$scope', '$http', function($rootScope, $scope, $http) {

Or better, you should just use the simple notation, and use ngAnnotate at build time to make your code minifiable:

cs.controller('login', function($rootScope, $scope, $http) {

Your code also doesn't make much sense: you send the username using HTTP when the controller is constructed. At this time, there is no username in the scope yet. This should be in a scope function, called from the view at the click of a button, for example.

thank you! it worked, i changed the controller decleration and made a login method when i click a button — Arthur, Mar 05 '16 at 12:16

How to get input values in AngularJS scope?

1 Answers1