【问题标题】:How to automatically open modal on app launch?如何在应用启动时自动打开模式?
【发布时间】:2015-03-26 22:00:44
【问题描述】:

目前我有一个模式,当单击按钮时会打开。但这不是我想要的,我希望在启动应用程序时打开模式。我的目标是创建一个仅在用户第一次使用该应用程序时出现的介绍模式。但是,我在应用启动时打开模式时遇到问题。第一步是在应用启动时打开模式。然后第二步是创建一个函数,如果用户之前使用过该应用程序,该函数将保存在本地存储中。如果没有,那么它将显示模态。如果是,那么它将隐藏模式。我在http://jsfiddle.net/zono/vHG7j/ 上看到过这个函数的例子,但是我也不能用我当前的模态来实现这个功能。非常感谢帮助,在此先感谢:)

我的模态:

<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>

JS:

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();
  };
  //Cleanup the modal when we're done with it!
  $scope.$on('$destroy', function() {
    $scope.modal.remove();
  });
})

【问题讨论】:

    标签: javascript modal-dialog ionic-framework hybrid-mobile-app


    【解决方案1】:

    你可以试试这样的:

    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();
      };
      //Cleanup the modal when we're done with it!
      $scope.$on('$destroy', function() {
        $scope.modal.remove();
      });
    
      // opens the modal only one time
      if(!localStorage.getItem("popupWasShown")){
        $scope.modal.show();
        localStorage.setItem("popupWasShown", true);
      }
    
    });
    

    【讨论】:

      猜你喜欢
      • 2019-04-08
      • 2023-03-14
      • 2016-02-18
      • 1970-01-01
      • 2016-10-11
      • 2013-04-07
      • 1970-01-01
      • 2012-11-08
      • 1970-01-01
      相关资源
      最近更新 更多