Ionic Model Login窗口作为全局方法?

时间:2016-05-21 21:14:03

标签: angularjs ionic-framework

我正在使用Ionic的应用程序。只有某些状态需要登录,因此它是可选的。如果用户未经过身份验证,我想触发登录模型。我对整个身份验证进行了排序,但不确定如何设置全局登录模型。

例如,默认的入门应用程序具有位于AppCtrl中的登录名。我可以通过login()... https://github.com/driftyco/ionic-starter-sidemenu/blob/master/js/app.js

从导航模板导航执行

如何将此作为全局方法或流程? (例如,启动登录模型,接受发布并从另一个控制器调用它)。

^这需要是工厂还是服务?

我希望做点像......

.controller('SecureCtrl', function ($state, $scope, User) {
   if(!isAuthenticated) (){ 

   User.login();
   // fires login model as user is not authenticated.

   }else{ 

  // do stuff};
   }
})

也许有人可以指出我正确的方向或一些简单的例子。我看到有关如何执行此操作的教程,但它们主要用于首先登录然后访问所有路由。我只需要在某些控制器上登录部分。

为了更好地说明我想要创建一个用户功能,它可以执行登录,注销,显示模型等。所以我可以直接从我的控制器调用。 User.login()。

(例如)

function User($scope, $ionicModal, $timeout) {

  // With the new view caching in Ionic, Controllers are only called
  // when they are recreated or on app start, instead of every page change.
  // To listen for when this page is active (for example, to refresh data),
  // listen for the $ionicView.enter event:
  //$scope.$on('$ionicView.enter', function(e) {
  //});

  // Form data for the login modal
  $scope.loginData = {};

  // Create the login modal that we will use later
  $ionicModal.fromTemplateUrl('templates/login.html', {
    scope: $scope
  }).then(function(modal) {
    $scope.modal = modal;
  });

  // Triggered in the login modal to close it
  $scope.closeLogin = function() {
    $scope.modal.hide();
  };

  // Open the login modal
  $scope.login = function() {
    $scope.modal.show();
  };

  // Perform the login action when the user submits the login form
  $scope.doLogin = function() {
    console.log('Doing login', $scope.loginData);

    // Simulate a login delay. Remove this and replace with your login
    // code if using a login system
    $timeout(function() {
      $scope.closeLogin();
    }, 1000);
  };
}

//然后从我的控制器我可以打电话。

.controller('SecureCtrl', function ($state, $scope, User) {
   if(!isAuthenticated) (){ 

   User.login();
   // fires login model as user is not authenticated.

   }else{ 

  // do stuff};
   }
})

如果用户是工厂,服务等,我不知道如何做到这一点。任何帮助将不胜感激。

3 个答案:

答案 0 :(得分:1)

您可以在isAuthenticated中公开$rootScope状态变量以存储登录状态,并使用它来检查用户的登录状态。

.controller('SecureCtrl', function ($state, $scope, $rootScope, User) {
    if(!$rootScope.isAuthenticated) (){ 
      User.login();
       // fires login model as user is not authenticated.
    } else{ 
       // do stuff
    };
  })
})

<强>更新User.login内使用$ionicModal.fromTemplateUrl方法弹出模态。

$ionicModal.fromTemplateUrl('templates/mylongform.html', {
  scope: $scope,
  animation: 'slide-in-up'
}).then(function(modal) {
  $scope.modal = modal;
});

请参阅此处的相同工作实施:http://codepen.io/ionic/pen/VLwLOG

答案 1 :(得分:1)

执行此操作的常用方法是在您的状态中添加自定义属性,例如&#39; needsLogin = true&#39;然后 聆听&$ 39; $ stateChangeStart&#39;如果用户未登录且我们将需要登录状态,则转到登录状态。

答案 2 :(得分:0)

// Double Model in same controller
// Create the login modal
$ionicModal.fromTemplateUrl('templates/myloginform.html',
{
  scope: $scope,
  animation: 'slide-in-up'
}).then(function(modal)
{
  $scope.modallogin = modal;
});

// Close the login modal
$scope.closeLogin = function()
{
    $scope.modallogin.hide();
};

// Open the login modal
$scope.openLogin = function()
{
    $scope.modallogin.show();
};

// Create the register modal
$ionicModal.fromTemplateUrl('templates/myregisterform.html',
{
  scope: $scope,
  animation: 'slide-in-up'
}).then(function(modal)
{
  $scope.modalregister = modal;
});

// Close the register modal
$scope.closeRegister = function()
{
    $scope.modalregister.hide();
};

// Open the register modal
$scope.openRegister = function()
{
    $scope.modalregister.show();
};