timeout in Angularjs

Question

I’m making an application in Ionic, which uses Angular.js as a base. I have a native Ionic splash with 3s and soon after enters the splash controller that has a 5s video with an animation. I wanted to know how to redirect to another controller, log in as soon as the video ends. Can someone help me with that?

Answer 1

To do what you want, whenever the application starts you redirect the route to any screen, for this, do a state go in the run:

angular.module('myApp', [])
  .config(something => {})
  .run(function ($state) {
    $state.go('rotaDaTelaComVideo');
  });

According to Angular documentation: Documentation

1. config is first called at module startup.

2. run is called once at module startup, just after config.

3. Compilation of Directives and others...

4. Controllers are created.

5. Guidelines link, if any.

In this way, it is safe to call a route in the run, of meneira that in the next iteration of Angular it will load its module.

Bonus:

Still, if you want the video to run only once, you can save a flag on localStorage:

angular.module('myApp', [])
  .config(something => {})
  .run(function ($state, $window) {
    if ($window.localStorage['alreadyShown'] !== true) {
      $state.go('rotaDaTelaComVideo');
      $window.localStorage['alreadyShown'] = true;
    }
  });

So it will run only the first time the user starts the application, or after clearing all the cache data.

Answer 2

Injects the $state to your Controller and after the video is finished use the $state.go.

function goLogin(){
$state.go("app.login-new");
}

Answer 3

<ion-view title="splash" id="splash" hide-nav-bar="true">
    <ion-content padding="true" class="has-header vcenter" scroll="false">
<video preload="metadata" autoplay="autoplay" webkit-playsinline="webkit-playsinline" class="videoPlayer">
  <source src="video/splash.mp4" type="video/mp4"/>
</video>
    </ion-content>
</ion-view>

Controller

.controller('splash', ['$scope', '$stateParams', 
function ($scope, $stateParams) {


}])