将属性ID设置为uibModal [英] Set property Id to a uibModal
问题描述
我想知道是否可以将Id属性设置为通过$ uibModal生成的模式,以便以后我可以通过其ID捕获对应的元素.我成功地生成了所需的模态,尽管以下代码并未对其进行唯一标识:
I would like to know if it is possible to set an Id property to a modal generated through $uibModal so later I can capture the correspondent element by its Id. I successfully managed to generate as many modals as I need although they are not uniquely identified with the following code:
var modalInstance = $uibModal.open({
templateUrl: 'openChat.html',
scope: $scope,
backdrop: 'static',
keyboard: false,
controller: 'openChatModalCtrl',
windowClass: 'chat-modal',
size: 'sm'
}).rendered.then(function () {
console.log('there you go!');
});
任何帮助将不胜感激.
推荐答案
id 属性可以由 ui-bootstrap 提供的$uibModalStack
工厂添加:
id property may be added by $uibModalStack
factory provided by ui-bootstrap:
$ctrl.open = function (size, windowTopClass, id) {
var modalInstance = $uibModal.open({
ariaLabelledBy: 'modal-title',
ariaDescribedBy: 'modal-body',
templateUrl: 'myModalContent.html',
controller: 'ModalInstanceCtrl',
controllerAs: '$ctrl',
size: size,
windowTopClass: windowTopClass,
windowTemplateUrl: 'my-window.html',
resolve: {
projects: function () {
return $ctrl.projects;
}
}
}).rendered.then(function () {
$uibModalStack.getTop().value.modalDomEl.attr('id', id);
});
注意$uibModalStack.getTop().value.modalDomEl.attr('id', id);
行,这样可以从模板中传递 id :
note $uibModalStack.getTop().value.modalDomEl.attr('id', id);
line, this way id can be passed from the template:
<button type="button"
class="btn btn-default"
ng-click="$ctrl.open('lg', 'my-outer-class2', 'myID2')">Open me2!</button>
还请注意,您可以使用$uibModal.open()
函数的 windowTopClass 或 windowClass 属性,这些类也将添加到顶层模式级别,因此您也可以将它们用于唯一选择器.
also please note, that you can use windowTopClass or windowClass properties of the $uibModal.open()
function, these classes will also be added to the top modal level, so you can also use them for unique selectors.
plunker应用了两个不同的 id s和css类: https://plnkr.co/edit/vMw1XtyNOED8PIDP0hWe?p=preview
plunker with 2 buttons applying 2 different ids and css classes: https://plnkr.co/edit/vMw1XtyNOED8PIDP0hWe?p=preview
这篇关于将属性ID设置为uibModal的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!