Bhumi Singhal Bhumi Singhal -4 years ago 112
AngularJS Question

Capture hide event in $modal of angular strap

I am using angular Strap to create a modal like :

$modal({
template : "/templ/alert-with-title.html",
content : content,
title : title,
show : true,
backdrop : true,
placement : 'center'
});


I have the written the following :

$scope.$on("modal.hide.before",function() {
console.log("Closing1");

});
$scope.$on("modal.hide",function() {
console.log("Closin2");
});


My
/templ/alert-with-title.html
is like this :

<div aria-hidden="true" aria-labelledby="windowTitleLabel" role="dialog"
tabindex="-1" class="modal hide fade in modal" id="">
<div class="modal-header">
<a class="fui-cross pull-right" ng-click="$hide()"></a>
<h3 ng-bind="title"></h3>
</div>
<div class="modal-body">
<div class="divDialogElements" >
<span ng-bind="content"></span>
</div>
</div>
<div class="modal-footer">
<div>
<button type="button" ng-click="$hide()"
class="btn btn-default btn-gray-l gray pull-left mar_t-4">OK</button>

</div>
</div>
</div>


However even after all this, I get no console logs when i click Ok. Why is this?

Answer Source

so the solution is very simple, I had to provide the scope to the $modal.

$modal({
  template : "/templ/alert-with-title.html",
  content : content,
  title : title,
  show : true,
  backdrop : true,
  placement : 'center',
  scope : $scope
});

But what I do not understand that why for an event that is "$emit" , $on of the outside scope would not work

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download