1

Bueno, mi problema es que no se porque me tira este error... estoy 99% seguro de que los scripts se cargan en el orden preciso... y tengo otra aplicación usando el atributo resolve del $routeProvider que funciona y no entiendo porque en este proyecto no funciona. Lo que estoy buscando es que antes de cargar el index.html obtenga datos de una base de datos, y que, después de obtener esos datos, cargue el index.html, ya que uso esos datos para generar un menú desplegable en la barra de navegación con links a otra página que amplían la información que se muestra en esa barra de navegación (un menú desplegable de productos que te dice los productos y cuando apretas en alguno te lleva a otra página con un informe más detallado del producto).

Les dejo los archivos html y js que uso:

index.html:

<!DOCTYPE html>
<html ng-app="tangoInfinito">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Tango Infinito - Todo el tango que estas buscando</title>
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="css/font-awesome.min.css">
        <link rel="stylesheet" href="css/estilos.css">
        <link rel="stylesheet" href="css/bootstrap-social.css">
        <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
        <link rel="icon" type="image/png" href="favicon32x32.png">
        <link rel="shortcut icon" type="image/x-icon" href="favicon32x32.ico">
        <script src="js/angular.js"></script>
        <script src="js/angular-route.min.js"></script>
        <script src="js/angular-resource.min.js"></script>
        <script src="js/app.js"></script>
        <script src="js/Controllers/ProductosController.js"></script>
        <script src="js/Services/ProductosService.js"></script>
        <!--<script src="js/app-route.js"></script>-->
        <script src="js/Filters/IdFilter.js"></script>

        <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
          <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->
    </head>
    <body ng-controller="ProductosController">
    </body>
</html>

app.js:

(function() {
    var app = angular.module("tangoInfinito", ["ngRoute"]);

    app.config(function($routeProvider) {
        $routeProvider
               .when("/", {
                    templateUrl: "main.html",
                    controller: "ProductosController",
                    resolve: {
                        datosResolve: ["ProductosService", function(ProductosService){
                            var datos = ProductosService.getDatos();
                            console.log(datos);
                            return datos;
                        }]
                    }
               })
               .when("/index.html", {
                    templateUrl: "main.html",
                    controller: "ProductosController",
                    resolve: {
                        datosResolve: ["ProductosService", function(ProductosService){
                            return ProductosService.getDatos();
                        }]
                    }
               })
    });

})();

ProductosService.js:

(function() {

    var module = angular.module("tangoInfinito");

    var ProductosService = function($http) {

        var getDatos = function() {
            return $http.get("php/get-productos.php").success(function(response) {
                                                        console.log(response);
                                                        return response;
                                                      });
        };

        return {
            getDatos: getDatos
        };
    };

    module.factory("ProductosService", ProductosService);
}
)();

ProductosController.js:

(function(){

    var module = angular.module("tangoInfinito");

    var ProductosController = function($scope, ProductosService, datosResolve) {

        var datos = datosResolve;

        $scope.productos = [{},{}];/* Esto es un array de objetos */

        $scope.rubros = [ "Musica", "Baile", "Otros"];

        $scope.tipos = [{},{}]; /* Esto es un array de objetos */

        var armarLista = function() {
            var lista = [];
            var rubrosTemp = $scope.rubros.slice(0);
            var tiposTemp = $scope.tipos.slice(0);

            for(var i = 0; i < rubrosTemp.length; i++) {

                var rubro = rubrosTemp[i].toUpperCase();

                lista.push( {descripcion: rubro, isHeader: true} ); 
                for(var j = 0; j < tiposTemp.length; j++) {
                    if(tiposTemp[j].rubro === rubrosTemp[i]) {
                        lista.push( {descripcion: tiposTemp[j].tipo, isHeader: false} );
                    }
                }
            }

            return lista;
        };

        //Lista para armar el menu desplegable (menu productos) de la barra de navegación
        //Esta lista es tomada por index.html y productos.html 
        //(en un script al final de la página) para armar el menu dinamicamente
        $scope.navbarList = armarLista();
    };

    module.controller("ProductosController", ProductosController);

})();

Espero puedan ayudarme... Gracias de antemano

0

1 respuesta 1

0

Tu App.js (function() {

    'use strict';

    angular
        .module('tangoInfinito', [
            'ngRoute'
        ])

        .config(function($routeProvider) {

        });
})();

Tu productServices.js

'use strict';

/**
 * @ngdoc service
 * @name apiFromApp.AuthServices
 * @description
 * # AuthServices
 * Factory in the apiFromApp.
 */
angular.module('tangoInfinito')
  .factory('ProductosService', ProductosService);

ProductosService.inject = ['$http'];

function ProductosService($http) {
  var service = {};



  service.getDatos = function (data) {
      return $http.get("php/get-productos.php").success(function(response) {
          console.log(response);
          return response;
      });
  }

  return service;

}

Tu ProductController

'use strict';

/**
 * @ngdoc function
 * @name apiFromApp.controller:PostcontrollerCtrl
 * @description
 * # PostcontrollerCtrl
 * Controller of the apiFromApp
 */
angular.module('tangoInfinito')
  .controller('ProductosController', ProductosController);

ProductosController.inject = ['$scope','ProductosService'];

function ProductosController($scope,ProductosService) {
    var datos = datosResolve;

    $scope.productos = [{},{}];/* Esto es un array de objetos */

    $scope.rubros = [ "Musica", "Baile", "Otros"];

    $scope.tipos = [{},{}]; /* Esto es un array de objetos */

    var armarLista = function() {
        var lista = [];
        var rubrosTemp = $scope.rubros.slice(0);
        var tiposTemp = $scope.tipos.slice(0);

        for(var i = 0; i < rubrosTemp.length; i++) {

            var rubro = rubrosTemp[i].toUpperCase();

            lista.push( {descripcion: rubro, isHeader: true} );
            for(var j = 0; j < tiposTemp.length; j++) {
                if(tiposTemp[j].rubro === rubrosTemp[i]) {
                    lista.push( {descripcion: tiposTemp[j].tipo, isHeader: false} );
                }
            }
        }

        return lista;
    };

    //Lista para armar el menu desplegable (menu productos) de la barra de navegación
    //Esta lista es tomada por index.html y productos.html 
    //(en un script al final de la página) para armar el menu dinamicamente
    $scope.navbarList = armarLista();

}

Usa las buenas practicas de angular por favor espero pueda ayudarte con esto

1
  • Perdón, me olvide de eliminar la pregunta... lo solucione pero cambie mucho código... no me acuerdo exactamente ahora que es lo que hice, pero por falta de tiempo tampoco lo puedo publicar ahora... voy a ver si en estos días puedo publicar que cambios hice para futuras lecturas el 9 dic. 2016 a las 3:51

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.