AngularJS - private modal function not working
close
and dismiss
are methods of the object $modalInstance
returned $modal.open
:
$scope.open = function() {
$scope.$modalInstance = $modal.open({
scope: $scope,
templateUrl: "modalContent.html",
size: '',
})
};
$scope.ok = function() {
$scope.$modalInstance.close();
};
$scope.cancel = function() {
$scope.$modalInstance.dismiss('cancel');
};
Another problem with your code is that you need to specify scope: $scope
in modal config. This is necessary if you want the area inside the modal template to be a child area of where you define the methods ok/cancel
.
Demo fixed: http://plnkr.co/edit/Y5s4yPm1TZB8S9nfO5CA?p=preview
source to share
I have updated your code with a working version
http://plnkr.co/edit/iM5o0le3OioqxHBNF3d1?p=preview
There are several bugs in the code.
$ modal is a factory, you cannot call $ modal.close ()
You will need to do something like:
this.modal = $modal(....)
this.modal.close();
However, even if you did it in your controller, your modal view doesn't have scope access.
The forked box solution I suggest is to use
ng-click="$parent.$close()"
source to share
There are several ways, as explained earlier, and it depends on what context you need to use it in.
For example, if the modal is just a notification, there is no need to use functions for the OK or CANCEL buttons, simply using $ reject () or $ close () on the ng-click of the buttons located in modalContent. html file will suffice.
Here is also the updated plunker
http://plnkr.co/edit/OfCGJX?p=preview
<div class="modal-footer">
<button class="btn btn-primary" ng-click="$close()">OK</button>
<button class="btn btn-warning" ng-click="$dismiss()">Cancel</button>
</div>
source to share