ui-router work

http://angularjs.org/

by Bruno Sabetta

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.min.js"></script>
<nav>
  <a href ui-sref="panels">Click to inject object with UI-ROUTER RESOLVE</a>
</nav>

<div ui-view></div>

JavaScript

var myApp = angular.module("myApp", ["ui.router"]);

myApp.config(config);
myApp.controller("panelsCtrl", panelsCtrl);
myApp.service('codeService', codeService);

panelsCtrl.$inject = ['$stateProvider'];
function config($stateProvider) {
  $stateProvider.state("panels", {
    url: "#",
    template: "<span>{{panels.init}}</span>",
    controller: "panelsCtrl",
    controllerAs: "panels",
    resolve: {
      init: ['codeService', function(codeService) {
        return codeService.init();
      }]
    },
  });
};

panelsCtrl.$inject = ['init'];
function panelsCtrl(init) {
  var $ctrl = this;
  $ctrl.init = init;
};

codeService.$inject = ['$q', '$timeout'];
function codeService($q, $timeout) {
  this.init = function() {
    var defer = $q.defer();

    $timeout(function() {
      defer.resolve({
        src: "I am ui router injected object"
      });
    }, 2000);

    return defer.promise;
  };
};