Modal Creation Service

ionic-v1
1

I am developing a mobile app using Ionic Framework and I am using a lot of modals in my application. I do something like this

//create login modal
    $ionicModal.fromTemplateUrl('templates/modals/login.html', {
        scope: $scope,
        animation: 'slide-in-up'
    }).then(function(modal) {
        $scope.loginModal = modal;
    });

I dont want to write these lines of code for every modal I create (about 10 of them) so I tried to write a modal factory function a a service. Here is my code:

.service(“ModalFactory”, function($ionicModal) {

});

2

… ähm and whats your problem?

3

I also had to use many modals in my app, furthermore I would like to pass parameters.
I created the service regarding the link below, you can use it inside another service which returns the modals already defined:

Ionic modal service

angular.module('app')
.factory('myModals', ['appModalService', function (appModalService){

var service = {
	showLogin: showLogin,
	showEditUser: showEditUser
};

function showLogin(userInfo){
	// return promise resolved by '$scope.closeModal(data)'
	// Use:
	// myModals.showLogin(userParameters) // get this inject 'parameters' on 'loginModalCtrl'
	//	.then(function (result) {
	//		// result from closeModal parameter
	//	});
	return appModalService.show('templates/modals/login.html', 'loginModalCtrl as vm', userInfo)
	// or not 'as controller'
	// return appModalService.show('templates/modals/login.html', 'loginModalCtrl', userInfo)
}

function showEditUser(address){
	// return appModalService....
}

}]);
1 Like
4

yep i have such services, too
Also for popups, modals and loadings.

thanks for sharing @julianpaulozzi