Sameer Dighe Sameer Dighe - 5 days ago 5
AngularJS Question

How to pass data between different modules using service having two different controller with different modules?

What I am doing here is, I have created one service to share the data between controller but the problem is both the controller is having a different modules. so my doubt here is, how can i make communication between two different controllers having different modules.

Here is my service

login.service.js

(function ()
{
'use strict';

angular
.module('app.pages.auth.login')
.factory('dataService', dataService);

/** @ngInject */
function dataService(){

var sendarr = [];

var addData = function(newObj) {
sendarr.push(newObj);
};

var getData = function(){
return sendarr;
};

return {
addData: addData,
getData: getData
};

}

})();


First controller login.controller.js

(function ()
{
'use strict';

angular
.module('app.pages.auth.login')
.controller('LoginController', LoginController);

/** @ngInject */
function LoginController(msApi,$state,dataService)
{
// Data
var vm = this;

vm.login = login;
vm.startApp = startApp;
vm.fbLogin = fbLogin;
var auth2;
// Methods
function fbLogin(){
FB.login(function(response){
if(response.status=='connected'){
testAPI();
}
else if(response.status == 'not_authorized'){
console.log('error');
}
else{
console.log('please log in');
}
});
}

function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Successful login for: ' + response.name);

});
}

function startApp(){
gapi.load('auth2', function(){
// Retrieve the singleton for the GoogleAuth library and set up the client.
auth2 = gapi.auth2.init({
client_id: '990822731291-21sdd22ujqc78l1q2i2lmf5hfe5satj1.apps.googleusercontent.com',
cookiepolicy: 'single_host_origin',
fetch_basic_profile: 'true',
// Request scopes in addition to 'profile' and 'email'
//scope: 'additional_scope'
});
attachSignin(document.getElementById('customGoogleBtn'));
});
}

function attachSignin(element) {
auth2.attachClickHandler(element, {},
function(googleUser) {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail());
var pushData = [profile.getId(), profile.getName(), profile.getEmail()];
console.log(pushData);
dataService.addData(pushData);
$state.go('app.pages_auth_verify-mobile')
},
function(error) {
alert(JSON.stringify(error, undefined, 2));
});
}

function login(){
var jsonData = {"mobile":vm.form.mobile};
msApi.request('login.credentials@save',jsonData,
// SUCCESS
function (response)
{
console.log(response.error);
if(response.error == 1){
vm.form.mobileErrorFlag = true;
}
if(response.error == 0){
vm.form.mobileErrorFlag = false;
}
},
// ERROR
function (response)
{
alert(JSON.stringify(response));
}
)
}



}
})();


Second Controller verify-mobile.controller.js

(function ()
{
'use strict';

angular
.module('app.pages.auth.verify-mobile',["app.pages.auth.login"])
.controller('VerifyMobileController', VerifyMobileController);

/** @ngInject */
function VerifyMobileController(dataService)
{
var data = dataService.getData();

alert(data);
}
})();


Please somebody help ?

Answer

I think you're not wrong. But I think you should make a module for your dataService and share it between others modules. You dataService don't really depends on your login module, so you can make it independant.

something like this :

  angular
    .module('app.services.shared')
    .factory('dataService', dataService);

 angular
    .module('app.pages.auth.login',["app.services.shared"])
 angular
    .module('app.pages.auth.verify-mobile',["app.services.shared"])

But it's subjective ...

Hope it's help.

Comments