Angular & UI Router - template is loading but nothing shows up on the document

Question

I'm using Angular 1 with UI Router(https://github.com/angular-ui/ui-router).

Here's how my main app.js looks like:

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

myApp.config(function($stateProvider, $urlRouterProvider) {
  $urlRouterProvider.otherwise("/overview");
  $stateProvider
    .state('overview', {
      url: "/overview",
      templateUrl: "templates/overview/overview.html"
    });
});

Thing is, I'm able to load overview.html but nothing displays on the document (the file for sure is not empty)

angular.js:11821 XHR finished loading: GET "http://localhost:8000/templates/overview/overview.html".

I'm not quiet sure why this happens.

Answer 1

I think you forgot tu put a div with the ui-view directive in your index.html

example: <div ui-view></div>

Another thing i'm not totally sure but its how i work, i put the "templateUrl" into a views list inside of the state.

An example im using at this moment:

  .state('home', {
        url: '/',
        views: {
          '@': {
            templateUrl: 'templates/main.html'
          }
        }
    });

Hope it works on you and if not, could you put more information about your problem please? I think i could help you (:

Answer 2

Okay the problem was that I used ng-view instead of ui-view.