Services
$ionicModel
Related: ionicModal controller.
The Modal is a content pane that can go over the user’s main view temporarily. Usually used for making a choice or editing an item.
Put the content of the modal inside of an <ion-modal-view> element.
Notes:
one modal will broadcast ‘modal.shown’, ‘modal.hidden’, and ‘modal.removed’ events from its originating scope, passing in itself as an event argument. Both the modal.removed and modal.hidden events are called when the modal is removed.
This example assumes your modal is in your main index file or another template file. If it is in its own template file, remove the script tags and call it by file name.
Usage
<script id="my-modal.html" type="text/ng-template">
<ion-modal-view>
<ion-header-bar>
<h1 class="title">My Modal title</h1>
</ion-header-bar>
<ion-content>
Hello!
</ion-content>
</ion-modal-view>
</script>
angular.module('testApp', ['ionic'])
.controller('MyController', function($scope, $ionicModal) {
$ionicModal.fromTemplateUrl('my-modal.html', {
scope: $scope,
animation: 'slide-in-up'
}).then(function(modal) {
$scope.modal = modal;
});
$scope.openModal = function() {
$scope.modal.show();
};
$scope.closeModal = function() {
$scope.modal.hide();
};
// Cleanup the modal when we're done with it!
$scope.$on('$destroy', function() {
$scope.modal.remove();
});
// Execute action on hide modal
$scope.$on('modal.hidden', function() {
// Execute action
});
// Execute action on remove modal
$scope.$on('modal.removed', function() {
// Execute action
});
});
Methods
fromTemplate(templateString, options)
Param Type Details
templateString string
The template string to use as the modal's content.
options object
Options to be passed ionicModal#initialize method.Returns: object An instance of an ionicModal controller.
fromTemplateUrl(templateUrl, options)
Param Type Details
templateUrl string
The url to load the template from.
options object
Options to be passed ionicModal#initialize method. options object.
Returns
: promise A promise that will be resolved with an instance of an ionicModal controller.
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。