Arquivo da tag: javascript

AngulasJS – Resolve

var app = angular.module("app", ["ngRoute"]);
 
app.config(function($routeProvider) {
    $routeProvider
      .when('/',
      {
        templateUrl: "view/app.html",
        controller: "AppCtrl",
        resolve: {
            app: function($q, $timeout) {
                var defer = $q.defer();
                $timeout(function() {
                    defer.resolve();
                }, 2000);
                return defer.promise;
            }
        }
      })
});
 
app.controller("AppCtrl", function($scope, $q) {
    $scope.model = {
        message: "I'm a great app!!!"
    }
});

AngularJS – Promise

app.controller("AppCtrl", function($scope, $q) {
 
    var defer = $q.defer();
 
    defer.promise
      .then(function(weapon) {
        alert("You can have my " + weapon)
 
        return "bow"
      })
      .then(function(weapon) {
        alert("And my " + weapon)
 
        return "axe"
      })
      .then(function(weapon) {
        alert("And my " + weapon)
      });
 
    defer.resolve("sword");
 
    $scope.model = {
        message: "This is my app!!!"
    }
});

O que podemos fazer com o “redirectTo”

Nesse exemplo mostra o que podemos fazer com o “redirectTo”

app.config(function($routeProvider) {
    $routeProvider
      .when('/',
      {
        templateUrl: "app.html",
        controller: "AppCtrl"
      })
      .when('/pizza/:crust/:toppings', {
        redirectTo: function(routeParams, path, search) {
            console.log(routeParams);
            console.log(path);
            console.log(search);
            return "/" + routeParams.crust;
        }
      })
      .when('/deep', {
        template: 'Deep dish'
      })
      .otherwise({
        redirectTo: "/"
      })
});

Diferença entre $routeProvider e $route

O $routeProvider nada mais é do que uma Factory que é usada:

app.config(function($routeProvider) {
  $routeProvider.when('/',
    {
      templateUrl: "app.html",
      controller: "AppCtrl"
    }
  )
});

O $route nada mais é do que um Service que pode ser usado assim também:

app.config(function($routeProvider) {
//  $routeProvider.when('/',
//    {
//      templateUrl: "app.html",
//      controller: "AppCtrl"
//    }
//  )
});
 
app.controller("AppCtrl", function($scope, $route) {
    $route.routes["/"] = {
        templateUrl: "app.html",
        controller: "AppCtrl"
    }
 
    $scope.model = {
        message: "This is my app!!!"
    }
});

Se você perceber ele substitui o $routeProvider.

Voltar para a página anterior com $route

Quando você precisa voltar pra a página anterior do seu sistema em AngularJS, basta usar assim:

<a ng-click='back()'>Back</a>
myModule.run(function ($rootScope, $location) {
 
    var history = [];
 
    $rootScope.$on('$routeChangeSuccess', function() {
        history.push($location.$$path);
    });
 
    $rootScope.back = function () {
        var prevUrl = history.length > 1 ? history.splice(-2)[0] : "/";
        $location.path(prevUrl);
    };
});

Referência: angularjs-getting-previous-route-path