Angularjs 角度引导UI模式将自定义关闭和关闭功能传递给ModalInstanceCtrl?
我正在尝试创建一个可重用的ModalInstanceCtrl,在这里我可以传递自定义OK和cancel函数以及任何自定义数据。我能够在值不是函数的情况下传递参数 在当前控制器中Angularjs 角度引导UI模式将自定义关闭和关闭功能传递给ModalInstanceCtrl?,angularjs,angular-ui-bootstrap,Angularjs,Angular Ui Bootstrap,我正在尝试创建一个可重用的ModalInstanceCtrl,在这里我可以传递自定义OK和cancel函数以及任何自定义数据。我能够在值不是函数的情况下传递参数 在当前控制器中 $scope.showInterest = function(jobId) { var params = { animation: true, templateUrl: 'show-insert-modal.php', controller: 'Moda
$scope.showInterest = function(jobId) {
var params = {
animation: true,
templateUrl: 'show-insert-modal.php',
controller: 'ModalInstanceCtrl',
size: 'sm',
resolve: {
params: function() {
var params = {
// included in params OK
modalName: 'showInterest',
jobId: jobId,
title: 'Show Interest',
//Not included in params
cancel: function() {
modalInstance.dismiss();
},
ok: function($modalScope) {
$modalScope.isSaving = true;
// some promise to run then
modalInstance.close()
}
};
return params;
}
}
};
var modalInstance = $modal.open(params);
}
ModalInstanceCtrl
app.controller('ModalInstanceCtrl', ['$scope', '$modalInstance', 'params',
function($scope, $modalInstance, params) {
function cancel(reason) {
params.cancel(reason);
}
function ok() {
//TypeError: params.ok is not a function
params.ok($scope);
};
// properties with functions are not part of the params variable
//console.log(params) = Object {modalName: "showInterest", jobId: 1907, title: "Show Interest"}
console.log(params);
var scope = {
isSaving: false,
params: params,
ok: ok,
cancel: cancel
};
angular.extend($scope, scope);
}
]);
您可以使用结果承诺调用您的方法。以下是一个基本示例:
crntPopup = $modal.open( tmpl )
crntPopup.result.then( function(){ yourCloseCallback()})
crntPopup.result.catch( function(){ yourDismissCallback()})
从模式文档()中:
open方法返回一个模态实例,即具有以下属性的对象:
- 关闭(结果)-可用于关闭模式并传递结果的方法
- 解除(原因)-可用于解除模式、传递原因的方法
- 结果-在模式关闭时解决的承诺,在模式取消时拒绝的承诺
- opened—在下载内容模板并解析所有变量后打开模式时解析的承诺
- 呈现-在呈现模式时解决的承诺
我尝试了这种方法问题是为了启动关闭回调,我必须调用modalInstance。$close()首先关闭模态,然后启动回调。我不确定我是否理解您的问题。您是说问题在于您必须调用
$close
来启动回拨,还是在调用$close
之后执行回拨,并且您希望它在关闭之前执行回拨?我会说,在JSFIDLE或plunker中重新创建它,那么我可能会更好地帮助您。同样,对于否决这个答案的人来说,这确实是一个有效的解决方案,我已经使用过,并且是UI.Bootstrap文档推荐的。是否有一个特别的原因,它被否决了,或者你只是不喜欢这个答案?我能够在值不是函数的地方传递params
-->那么你认为是什么?@PSL console.log(params)=Object{modalName:“showInterest”,jobId:1907,title:“Show Interest”}它也应该有你的方法,不是吗?尝试单独隔离问题,并查看是否有其他内容正在覆盖您的属性。代码按原样应该可以工作。@PSL是的,你是对的。代码确实可以工作。我从模板中调用了错误的函数,但我还没有设置“确定”和“取消”函数。这是其中的一天;)。