Javascript 爱奥尼亚·莫代尔'；t打开

我最近尝试创建一个离子模式。我从网上找到的多个例子开始，但我无法让它们发挥作用。有人能告诉我哪里出了问题吗？提前感谢：）

调用模态：

<button class="ion-ios-information-outline button button-clear" ng-click="openModal()"></button>

模式页面：

angular.module('Mob').controller('TeamCtrl', function($scope, $ionicModal) {

  /* Modal */
$ionicModal.fromTemplateUrl('intro-modal.html', {
    scope: $scope,
    animation: 'slide-in-up'
  }).then(function(modal) {
    $scope.modal = modal
  })  

  $scope.openModal = function() {
    $scope.modal.show()
  }

  $scope.closeModal = function() {
    $scope.modal.hide();
  };

  $scope.$on('$destroy', function() {
    $scope.modal.remove();
  });
};

<script id="intro-modal.html" type="text/ng-template">
  <div class="modal">
    <ion-header-bar>
      <h1 class="title">Edit Contact</h1>
    </ion-header-bar>
    <ion-content>
      <div class="list">
        <label class="item item-input">
          <span class="input-label">Name</span>
          <input type="text" ng-model="contact.name">
        </label>
        <label class="item item-input">
          <span class="input-label">Info</span>
          <input type="text" ng-model="contact.info">
        </label>
      </div>

      <button class="button button-full button-energized" ng-click="closeModal()">Done</button>
    </ion-content>
  </div>
</script>

编辑联系人
名称
信息
多恩

您应该检查以下事项：

控制器是否实例化？是否从视图中的控制器内调用该函数？您能否成功调用其他函数？尝试在其中添加另一个按钮，使用

ng click=“test（）”

并在控制器中添加

$scope.test=function（）{console.log（'it works'）；}

并查看在控制台中单击按钮是否有效

另一件事，ionic modal文档$ionic modal/

我认为模式页面应该包装在ion模式视图容器中：

<script id="my-modal.html" type="text/ng-template">
  <ion-modal-view>
    <ion-header-bar>
      <h1 class="title">Edit Contact</h1>
    </ion-header-bar>
    <ion-content>
      <div class="list">
        <label class="item item-input">
          <span class="input-label">Name</span>
          <input type="text" ng-model="contact.name">
        </label>
        <label class="item item-input">
          <span class="input-label">Info</span>
          <input type="text" ng-model="contact.info">
        </label>
      </div>
      <button class="button button-full button-energized" ng-click="closeModal()">Done</button>
    </ion-content>
  </ion-modal-view>
</script>

编辑联系人
名称
信息
多恩

尝试删除

<script id="my-modal.html" type="text/ng-template">

标记模板，只保留html模板中的内容，正如@wiherek所说的，使用离子模式视图

因此，您的my-modal.html模板应该是这样的：

<ion-modal-view>
    <ion-header-bar>
      <h1 class="title">Edit Contact</h1>
    </ion-header-bar>
    <ion-content>
      <div class="list">
        <label class="item item-input">
          <span class="input-label">Name</span>
          <input type="text" ng-model="contact.name">
        </label>
        <label class="item item-input">
          <span class="input-label">Info</span>
          <input type="text" ng-model="contact.info">
        </label>
      </div>
      <button class="button button-full button-energized" ng-click="closeModal()">Done</button>
    </ion-content>
  </ion-modal-view>

编辑联系人
名称
信息
多恩

不，它只是没有打开模式页面我知道控制器工作，因为我在控制器中有其他功能。。。我刚刚编辑了其他函数以缩短它。您是否尝试过使用

指令包装器？