Search code examples
angularjsangular-ui-bootstrapangular-bootstrap

How to refresh the templateUrl in an opened modal from Angular-ui Bootstrap?


I have a modal that using a templateUrl. I would like the refresh the html in the template. How can I do that without closing the modal?

I have a modal using a view shared in different context. And depending of the route, actions happens in this view. I change my routes and my modal still open but it's template won't refresh because I don't want the view that contains the modal to reload.

Can I switch the template while the modal is open?

I would like to reload the assets/templates/myTemplate.html while the modal is open:

$modal.open({
  templateUrl: "assets/templates/myTemplate.html",
  controller: "controller",
  scope: $scope
});

Solution

  • You can change the content in the modal, using ng-bind-html

       <div ng-bind-html="myContent"></div>
    

    It also requires to sanitize the content including ngSanitize module

       angular.module('ui.bootstrap.demo', ['ui.bootstrap', 'ngSanitize']);
    

    Then you can change the content, modifying the variable $scope.myContent.

    Here is the Plunkr

    http://plnkr.co/edit/ZiUOoEFEoSgN4fOgKCh5?p=preview

    I hope it helps

    Reference: AngularJS : Insert HTML into view