Angular Modal: add template from another html

I have a modal template in another html file but after the page was loaded first time modal window opens without a content, second time it's all ok. How can this be fixed?

Here's the plunker http://plnkr.co/edit/lw056nAaU7BfqIVZSddb?p=preview

//Open modal on main page with:
<div ng-controller="ModalDemoCtrl">
<button type="button" class="btn btn-default" ng-click="open()">Open me!</button>
<button type="button" class="btn btn-default" ng-click="open('lg')">Large modal</button>
<button type="button" class="btn btn-default" ng-click="open('sm')">Small modal</button>
<button type="button" class="btn btn-default" ng-click="toggleAnimation()">Toggle Animation ({{ animationsEnabled }})</button>
<div ng-show="selected">Selection from a modal: {{ selected }}</div>

You should not wrap your template with <script type="text/ng-template" id="myModalContent.html"></script>.

Ui-modal expects direct HTML here.

If you need to use ng-template, you should insert the ng-template script tag in your index.html (or anywhere else but it should be loaded in your page) and open your modal with template instead of templateUrl this way :

var modalInstance = $uibModal.open({
      animation: $scope.animationsEnabled,
      template: "<div ng-include src=\"'myModalContent.html'\"></div>",
      controller: 'ModalInstanceCtrl',
      size: size,
      resolve: {
        items: function () {
          return $scope.items;
        }
      }
});