CODEWITHSUNDEEP
javascriptangularjsangular-ui-router
Michelangelo
Michelangelo

Reputation: 5958

Angular ui-router is not instantiated, giving an inject module error

Hello I have a weird problem with Angular UI-router. I was about to renew a webapp and want do this with Angular. I have heard a lot of good things about UI-router but I am not getting it to work. I am following the tutorial on how to set up views, but I get an error: Uncaught Error: [$injector:modulerr] Failed to instantiate module fqmApp due to: TypeError: undefined is not a function

I am using cdn's to import angular and ui-router. This is my exact code:

<!doctype html>

<html ng-app="fqmApp">

    <head>
        <script src="https://code.angularjs.org/1.3.9/angular.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.13/angular-ui-router.min.js"></script>
        <script src="app.js"></script>

    </head>

    <body>


        <div ui-view>


        </div>


        <a ui-sref="state1">State 1</a>
        <a ui-sref="state2">State 2</a>

    </body>

</html>

JS

"use strict"

angular.module("fqmApp", ["ui.router"])

.config(function ($stateProvider, $urlRouterProvider) {

    //For any unmatched url, redirect to /state1
    $urlRouterProvider.otherwhise("/state1");

    //Now set up the states
    $stateProvider
        .state('state1', {
            url: "/state1",
            templateUrl: "partials/state1.html"
        })
        .state('state2', {
            url: "/state2",
            templateUrl: "partials/state2.html"
        });


})

.controller("ctrl", function ($scope) {
    $scope.hello="hello";
})

Everything works fine if I don't include the config service code. I am not getting where I am going wrong here. The controller was just a test. It works fine. This is probably some silly mistake but I have been looking at it for an hour or more now.

Does somebody see the problem? Thanks in advance.

Upvotes: 0

Views: 1991

Answers (1)

Rise Ledger
Rise Ledger

Reputation: 969

The problem with the code is that you have a typo, it should be otherwise instead of otherwhise Change this part:

$urlRouterProvider.otherwhise("/state1");

In this:

$urlRouterProvider.otherwise("/state1");

Upvotes: 1

Related Questions