How to use Multiple View with routing using angularjs

Question

I want to use multiple controller using routing concept of angularjsbut i am getting as below error.

Error:

Error: [$injector:unpr] http://errors.angularjs.org/1.2.25/$injector/unpr?p0=%24windowsProvider%20%3C-%20%24windows
    at Error (native)
    at http://localhost:2585/Scripts/angular.min.js:6:450
    at http://localhost:2585/Scripts/angular.min.js:36:202
    at Object.c [as get] (http://localhost:2585/Scripts/angular.min.js:34:305)
    at http://localhost:2585/Scripts/angular.min.js:36:270
    at c (http://localhost:2585/Scripts/angular.min.js:34:305)
    at d (http://localhost:2585/Scripts/angular.min.js:35:6)
    at Object.instantiate (http://localhost:2585/Scripts/angular.min.js:35:165)
    at http://localhost:2585/Scripts/angular.min.js:67:419
    at link (http://localhost:2585/Scripts/angular-route.js:910:26) <div data-ng-view="" class="ng-scope">

My try:

_Layout.cshtml

<html leng="en" data-ng-app="@ViewBag.InitModule">

index.cshtml

@{
    ViewBag.Title = "Home Page";
    ViewBag.InitModule = "homeIndex";
}
@section Scripts{
    <script src="../Scripts/angular-route.js"></script>
    <script src="~/js/home-index.js"></script>
}
<div data-ng-view=""></div>

home-Index.js

var module = angular.module("homeIndex", ['ngRoute'])

module.config(function ($routeProvider) {        
    $routeProvider.when("/", {
        controller: "homeIndexController",
        templateUrl: "/templates/AccountTypeView.html"
    });
    $routeProvider.when("/add", {
        controller: "newAccountTypeController",
        templateUrl: "/templates/addAccountType.html"
    });
    $routeProvider.otherwise({ redirectTo: "/" });
});
//homeIndexController
function homeIndexController($scope, $http) {
    //homeIndexController code which is working fine
}
//newAccountTypeController
function newAccountTypeController($scope, $http, $windows) {
    $scope.newAccountType = {};
    $scope.save() = function () {
        alert($scope.newAccountType.name);
    };
}

addAccountType.html

<h3>Add New AccountType</h3>
<form name="AddAccountType" novalidate data-ng-submit="save()">
    <div class="form-group">
        <label for="title">AccountType</label>
        <input type="text" class="form-control" data-ng-model="newAccountType.name" required />
        <span class="has-error" data-ng-show="AddAccountType.name.$error.required">*</span>
    </div>
    <div>
        <input type="submit" value="Submit" class="btn-primary" />
    </div>
</form>

When I am calling homeIndexController controller then it is working fine but when i and trying to call newAccountTypeController then i am getting error as above.

As i know it is not big error but I am new with angularjs. to solve it i did lots of google and i got lots of answer also but unable to solve. So if someone have solution of this problem then help me any suggestion will be accepted. Thanks it advance.

weisk · Accepted Answer · 2014-09-30 11:22:08Z

1

The error is telling you that angular couldn't find the service you are injecting on your controller, named windowsProvider.

Maybe you meant $window?

function newAccountTypeController($scope, $http, $window) {
    $scope.newAccountType = {};
    $scope.save = function () {
        alert($scope.newAccountType.name);
    };
}

By the way, you had an error on your save function definition...

EDIT: 'unpr' stands for Unknown Provider. Yes I know, super verbose right ?

answered Sep 30, 2014 at 11:22

weisk

2,5402 gold badges20 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to use Multiple View with routing using angularjs

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related