Call Method in Routes in Angularjs

Question

I have a controller called Productocontroller in Angularjs, this controller should have two methods, one to list all products when I pass a URL and another method to bring the product details when it is another URL.

Example:

/produto/:codDepartamento - Rota para listar os departamentos

/produto/ficha/:codProduto - Rota para exibir os detalhes do produto

How would it be done to call a method from these routes?

Answer 1

You can do the following:

1. Create a second controller, specific for product details

   angular.module('myApp', ['$routeProvider', function($routeProvider) {
     $routeProvider
       .when('/produto/:codDepartamento', {
         templateUrl: 'path/to/lista.html',
         controller: 'ProdutoListaController'
        })
       .when('/produto/ficha/:codProduto', {
         templateUrl: 'path/to/detalhes.html',
         controller: 'ProdutoDetalhesController'
       });
    }])
   .controller('ProdutoListaController', ['$scope', '$routeParam',
      function($scope, $routeParam) {
        /* $routeParams.codDepartamento possui o código do dpto */
   
        /* ... */
      }
   ])
   .controller('ProdutoDetalhesController', ['$scope', '$routeParam',
      function($scope, $routeParam) {
        /* $routeParams.codProduto possui o código do produto */
   
        /* ... */
      }
   ]);
   

2. Create a route that accepts optional arguments (possible from Angularjs version 1.2.0):

   angular.module('myApp', ['$routeProvider', function($routeProvider) {
     $routeProvider
       // Note o sinal de interrogação no codProduto
       .when('/produto/:codDpto/:codProduto?', {
         templateUrl: 'path/to/template.html',
         controller: 'ProdutoController'
        });
    }])
   .controller('ProdutoController', ['$scope', '$routeParam', '$location',
      function($scope, $routeParam, $location) {
        if ($routeParams.codDpto === "ficha")
            if ($routeParams.hasOwnProperty("codProduto") &&
                $routeParams.codProduto) {
                // Buscar lista de produtos
             }
        } else {
             // Busca Dpto
        }
      }
   ]);
   

3. Use the $location.path() to know which route is:

   angular.module('myApp', ['$routeProvider', function($routeProvider) {
     $routeProvider
       .when('/produto/:codDpto', {
         templateUrl: 'path/to/template.html',
         controller: 'ProdutoController'
        })
       .when('/produto/ficha/:codProduto', {
         templateUrl: 'path/to/template.html',
         controller: 'ProdutoController'
        });
    }])
   .controller('ProdutoController', ['$scope', '$routeParam', '$location',
      function($scope, $routeParam, $location) {
        if (/^produto\/ficha/.test($location.path())) {
            // Busca Produto. Código no $routeParams.codProduto
        } else {
            // Busca Dpto
        }
      }
   ]);
   

I consider the first alternative to more "correct".