Right way to define popup

Hello, i have have to use around 20 popups in my application. and every popup have some dropdown, range slider and input box. Now i want to know what is the best strategy i use to define all popup in my application, if i use directive for each and every popup i have to define different different html, is there any method though which i define all popup in one html.

Just have a folder called popups in your templates directory with files looking like this:

templates/popups/hi-popup.html

<ion-popover-view>
	<ion-header-bar>
		<h1 class="title">My Popover Title</h1>
	</ion-header-bar>
	<ion-content>
		Hello!
	</ion-content>
</ion-popover-view>

Then in your specific controllers pull whatever popup you need:

$ionicPopover.fromTemplateUrl('templates/popups/hi-popup.html', {
	scope: $scope
}).then(function(popover) {
	$scope.hiPopup = popover;
});

Here are the Ionic popover docs.