Move buttons below each other in popup using ionicPopup.show

I've created this popup using

        $ionicPopup.show({
        title: 'Choose Location...',
        buttons:[
            {
                text: "Current Location",
                type: 'button-positive',
                onTap: function(){
                    $scope.myLocation();
                }
            },
            {
                text: "Previous Locations",
                type: 'button-positive',
                onTap: function(){
                    $state.go('menu.listSelect');
                    //go to choose location page
                }

            },
            {
                text: "Address Book",
                type: 'button-positive',
                onTap: function(){

                    //go to address book
                }
            },
            {
                text: "Cancel",
                type: 'button-positive',
                onTap: function(){
                    console.log('cleek');
                    $scope.fillOptionPopup.close();
                }
            },
        ]

    });
};

This places the buttons created next to teach other like so

http://i.stack.imgur.com/e0INi.png

Is there a way to make the buttons so they stretch across the width of the popup and each button is on a new line using that format of creating buttons for the popups?

Ive used this code in place of the buttons array and it gives me this, which is what i want but the ng-click isnt calling the functions that i made out of the ontap's from the array.

http://i.stack.imgur.com/MUELg.png

template:   '<button class="button button-positive" ng-mousedown="goMyLocation()">Current Location</button><br>'+
'<button class="button button-positive" ng-mousedown="goMenuList()">Previous Locations</button><br>'+
'<button class="button button-positive" ng-mousedown="goAddressBook()">Address Book</button><br>'+
'<button class="button button-positive" ng-mousedown="closePopup()">Close</button>'

is there a way to get the buttons to be one per row and full width of the popup?

ok now that i read the entire question i can help you, the first code snipped will never do what you wan't w/o modifying the popup css because of the default popup layout

in order for the second layout to work (using the template) you need to pass the scope parameter to your popup, so the buttons are linked to the scope holding the functions

http://ionicframework.com/docs/api/service/$ionicPopup/

There actually another option that I find "cleaner". In the object passed to the show method you can also define a css class for the popup, so you can use it to override the default ionic styles.

Specifically for your use case:

.popup-vertical-buttons button
{
    min-width: 100%;
    margin-bottom: 5px;
}
.popup-vertical-buttons .popup-buttons
{
    display: block;
}

and in the object use pass to the show method add:

cssClass: "popup-vertical-buttons"