0

Galera,

estou acompanhando o livro ng-book do angular, e para fazer uma SPA, estou utilizando a seguinte estrutura:

 - app
   - controller
       controller.js
   - js
       main.js
   - node_modules (com os arquivos de jquery, bootstrap e angular)
   - templates
       home.html
 index.html

index.html

<!DOCTYPE html>
<html>
  <head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Título  -->
    <title>Treinando Angular</title>

    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">    

  </head>

  <body ng-app="myApp">

    <div ng-view></div>

    <!-- Jquery  -->
    <script src="node_modules/jquery/dist/jquery.min.js"></script>
    <!-- Bootstrap  -->
    <script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
    <!-- Angular  -->
    <script src="node_modules/angular/angular.min.js"></script>
     <!-- Angular Route -->
    <script src="node_modules/angular-route/angular-route.min.js"></script>    
    <!-- Main  -->
    <script src="js/main.js"></script>   
    <!--Controller  -->
    <script src="controller/controller.js"></script>
  </body>
</html>

main.js

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

app.config(function($routeProvider){
    $routeProvider
        .when("/", {
            templateUrl: "templates/home.html",
            controller: "HomeController"
        })
        .otherwise({ redirectTo: '/' });
}); 

controller.js

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

app.controller("HomeController", function(){
});

Com isto, a minha index.html não renderiza no local da ng-view, o conteudo da página home.html. Pois ja pesquisei várias páginas, e até com angular-route.js não funciona. Estou utilizando o Browser "Chrome".

1
  • Como está seu home.html?
    – Rafael
    3/08/2016 às 12:08

2 Respostas 2

1

Você não está chamando o "ngRoute" na sua main.js

var app = angular.module("myApp", ['ngRoute']);

e em sua controller você está criando novamente o "myApp", teria que ser assim:

var app = angular.module("myApp");
2
  • Tb utilizei assim e não está funcionando. 4/08/2016 às 11:47
  • @AndersonMartins Você está usando as rotas do Html 5? Se sim precisa configurar o LocationProvider html5mode, caso contrario você precisará passar o "#" nas url's 4/08/2016 às 17:08
-1

Acho que faltou o ng-app e o ng-controller no index. Você só declara as dependências no primeiro arquivo que declara a aplicação angular. no caso só na main vai ter o angular.module("myApp",[]) (Colchetes)

1
  • Acredito que como quero fazer uma SAP, não necessitaria de utilizar o ng-controller e o ng-app, está declarado na tag body, do index.html. 4/08/2016 às 11:49

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .