Javascript 将本地模板加载到外部模板

关于标题，我很抱歉，不确定有没有更好的主题行

在我的爱奥尼亚项目中，我有一个我经常使用的弹出窗口，但它在不同的页面中重复了很多次。目前，每个popover在每个控制器/页面视图中都是唯一定义的……这意味着如果我想更改页面的一个元素，我需要编辑每个页面中popover的每个实例

为了清理问题，我想将嵌入的脚本/模板移动到一个外部文件中，该文件的名称如下：

  $ionicPopover.fromTemplateUrl('templates/popover.html', {
    scope: $scope,
    animation: 'slide-in-up',
    focusFirstInput: false 
  }).then(function(popover) {
    $scope.popover = popover;
  });

  $ionicPopover.fromTemplateUrl('templates/popover.html', {
    scope: $scope,
    animation: 'slide-in-up',
    focusFirstInput: false 
  }).then(function(popover) {
    $scope.popover = popover;
  });

很简单…但是，有些弹出窗口需要自定义HTML和自定义$scope变量。是否可以定义可以传递到外部模板中的本地

模板代码？比如：

主模板：

<ion-view id="view">
  <ion-nav-title>
    ... 
  </ion-nav-title>
  <ion-content id="thisContent">

     <script id="popoverExtras.html" type="text/ng-template">
         <div id="customDiv1"> {{data1}} .. some content .. </div>
         <div id="customDiv2"> {{data2}} .. more content .. </div>
     </script>  
  </ion-content>
</ion-view">

  $ionicPopover.fromTemplateUrl('templates/popover.html', {
    scope: $scope,
    animation: 'slide-in-up',
    focusFirstInput: false 
  }).then(function(popover) {
    $scope.popover = popover;
  });