M. Gamie
M. Gamie

Reputation: 183

ui-view not working angularjs

I configured a route using ui-route as follows,

var app = angular.module("productManagement",
                        ["common.services",
                         "ui.router",
                         "productResourceMock"]);

app.config(["$stateProvider",
    function($stateProvider){
            // Products
            $stateProvider
            .state("productList", {
                url: "/products",
                templateUrl: "app/products/productListView.html",
                controller: "ProductListCtrl as vm"
            })

    }]
);

below is my index.html

<body ng-app="productManagement">
  <div class="container">
      <div ui-view></div>   
  </div>
</body>

it is not showing any error in console, and no views shown at all !!? it used to work fine just before adding the route

this is part of the course AngularJS Line of Business Applications from www.pluralsite.com by Deborah Kuratah episode 26 "setting up the routing"

Upvotes: 0

Views: 1597

Answers (1)

yesIcan
yesIcan

Reputation: 1711

You have to 1. have a default route 2. redirect to home if the state is not defined

app.config(["$stateProvider","$urlRouterProvider",
      function($stateProvider,$urlRouterProvider){
            // Products
           $urlRouterProvider.otherwise("/");
            $stateProvider
           .state("home", {
                url: "/",
                templateUrl: "app/products/productListView.html",
                controller: "ProductListCtrl as vm"
            })
            .state("productList", {
                url: "/products",
                templateUrl: "app/products/productListView.html",
                controller: "ProductListCtrl as vm"
            }}  
     }]
   );

Upvotes: 1

Related Questions