如何使用angularjs使用多视图和路由

时间:2014-09-30 10:34:12

标签: angularjs asp.net-mvc-5 asp.net-web-api

我想使用多个控制器使用angularjs的路由概念,但我得到如下错误。

错误:

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"> 

我的尝试:

_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>

主-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>

当我打电话给homeIndexController控制器时,它工作正常,但当我尝试拨打newAccountTypeController时,我收到错误,如上所述。

我知道这不是大错误,但我是angularjs的新手。解决它我做了很多谷歌,我也得到了很多答案,但无法解决。因此,如果有人解决了这个问题,那么请帮助我任何建议都会被接受。谢谢它提前。

1 个答案:

答案 0 :(得分:1)

错误告诉您,angular无法找到您在控制器上注入的服务,名为windowsProvider

也许你的意思是$window

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

顺便说一句,您的save函数定义错误...

编辑:&#39; unpr&#39;代表未知提供商。是的,我知道,超级详细吧?