CODEWITHSUNDEEP
angularjs
Millenial2020
Millenial2020

Reputation: 2923

angular how to pass an object from controller to service

i have this in my controller that retrieve and object inside the $scope.formData.

angular.module('starter.controllers', [])

.controller('loginController', function($scope, Authentication){
$scope.formData = {};

$scope.processForm = function(){
    Authentication.login($scope.formData);
    //$http({
    //    method  : 'GET',
    //    url     : 'http://localhost:8888/employees/login',
    //    params: $scope.formData
    //})
    //    .success(function(respond){
    //        $scope.state.go('main');
    //    })
}

})

in the service js i have a method called login that it suppose to retrive the data sent from the controller, but so far im getting a value null when i do console.log(formData),.

angular.module('starter.services', [])

.factory('Authentication', function($http){

    this.login = function(formData){
    console.log(formData);
    return $http({
            method  : 'GET',
            url     : 'http://localhost:8888/employees/login',
            params: formData
        })
}

    return null;
})

this is my html

<ion-view view-title="login">
<ion-content class="padding has-header">
    <div class="row">
        <div class="col col-50 col-offset-25">
            <div class="card">
                <div class="item item-text-wrap">
                    <form ng-submit="processForm()">
                        <div class="list">
                            <label class="item item-input">
                                <input type="text" placeholder="First Name" ng-model="formData.AccessKey" required="true">
                            </label>
                            <label class="item item-input">
                                <input type="text" placeholder="Last Name" ng-model="formData.Password" required="true">
                            </label>
                        </div>
                        <button class="button button-full button-positive">
                            Sign me in
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</ion-content>

i get this console error Cannot read property 'login' of null

my app.js

angular.module('starter', ['ionic', 'starter.controllers', 'starter.services'])

Upvotes: 0

Views: 1445

Answers (2)

Millenial2020
Millenial2020

Reputation: 2923

i found my issue 

.factory('Authentication', function($http){

return {
    login:  function(formData) {
        $http({
            method  : 'GET',
            url     : 'http://localhost:8888/employees/login',
            params: formData
        })
        .success(function(respond){
            console.log(respond);
        })
    }
};

Upvotes: 0

arman1991
arman1991

Reputation: 1166

If I read your code correctly, the problem is that you are using 2 different modules.

Try to use same modules for controller

 angular.module('sameModule', [])

    .controller('loginController', function($scope, Authentication){
...}

and service/factory like

     angular.module('sameModule', [])

.factory('Authentication', function($http){...
}

or to inject module from service/factory to module of controller:

angular.module('starter.controllers', ['starter.services'])

Read also this topic, it could help you to understand the idea...

Hope it will be helpfull.

Upvotes: 0

Related Questions