[英]ionic modal remove and animation is not working
我正在使用离子模式,其中一旦我打开离子模式并提交按钮,离子移除模型就无法正常工作,甚至动画也无法在模式中使用。我尝试使用离子隐藏来代替移除,但仍然可以任何人都不能告诉我离子模态的问题是什么。
模态:
'use strict';
(function () {
angular.module('main')
.service('ModalService', ModalService);
ModalService.$inject = ['$ionicModal', '$log'];
function ModalService ($ionicModal, $log) {
var init = function (tpl, $scope) {
var promise;
var a = $scope;
$scope = a;
promise = $ionicModal.fromTemplateUrl(tpl, {
scope: $scope,
animation: 'slide-in-right'
}).then(function (modal) {
$scope.modal = modal;
return modal;
});
$scope.openModal = function () {
$log.log('openModal function got clicked', $scope);
$scope.modal.show();
};
$scope.closeModal = function () {
$scope.modal.hide();
};
$scope.removeModal = function () {
$scope.modal.remove();
};
$scope.$on('$destroy', function () {
$scope.modal.remove();
});
return promise;
};
return {
init: init
};
}
})();
调用离子移除和隐藏的控制器:
function modalFunction (htmlpath) {
vm.modalListType = 'category';
ModalService
.init(htmlpath, $scope)
.then(function (modal) {
$log.log('modal success');
catModal = modal;
catModal.show();
vm.search = '';
});
}
function closeModal () {
catModal.hide();
}
function removeModal () {
$log.log('removeModal got called', catModal);
catModal.remove();
}
HTML文件:
<div class="center-align">
<button class="button trans-but m-t-10" type="submit" ng-click="vm.addProduct()">{{'save_message' | translate}}</button>
</div>
调用remove函数的函数:
function addProduct () {
$log.log('addProduct called: ', vm.product);
var data = [];
data.push({field: vm.product.type, type: 'text', name: $translate.instant('{{"producttype_message" | translate}}')});
data.push({field: vm.product.count, type: 'num', amounttype: 'Advance', name: $translate.instant('{{"ecount_message" | translate}}')});
data.push({field: vm.product.rate, type: 'num', amounttype: 'Advance', name: $translate.instant('{{"eprice_message" | translate}}')});
CommonService.validate(data).then(function () {
//vm.product.total = (vm.product.count - vm.product.deduction) * vm.product.rate;
vm.products.push(vm.product);
closeModal();
removeModal();
}, function (err) {
cordova.plugins.Keyboard.close();
CommonService.toast(err);
});
}
如果尝试使用函数$scope.modal.hide();
关闭模态$scope.modal.hide();
由于如果使用remove()
,则必须再次创建模式。
可能的解决方案可能是:
function closeModal () {
$scope.modal.hide();
}
要么
function closeModal () {
$scope.modal.remove();
}
这将在您的modalFunction控制器中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.