带有asp.net Boilerplate的角度注入器无法正常工作

时间:2014-11-24 12:53:24

标签: javascript asp.net angularjs

我正在尝试使用带有asp.net Boilerplate的Angular注入, 我正在遵循这里的“教程”http://www.codeproject.com/Articles/791740/Using-AngularJs-ASP-NET-MVC-Web-API-and-EntityFram#ArticleBuildWebApiServices

开始使用我的项目,现在我想将任务加载为部件

但由于某种原因,我收到以下错误:

Error: [ng:areq] http://errors.angularjs.org/1.3.2/ng/areq?p0=os.views.part.list&p1=not%20aNaNunction%2C%20got%20undefined at Error (native) at http://localhost:6234/Scripts/angular.min.js:6:416 at Nb (http://localhost:6234/Scripts/angular.min.js:19:417) at ob (http://localhost:6234/Scripts/angular.min.js:20:1) at $get (http://localhost:6234/Scripts/angular.min.js:75:177) at http://localhost:6234/Scripts/angular.min.js:57:112 at r (http://localhost:6234/Scripts/angular.min.js:7:408) at I (http://localhost:6234/Scripts/angular.min.js:56:496) at g (http://localhost:6234/Scripts/angular.min.js:51:299) at http://localhost:6234/Scripts/angular.min.js:50:414 申请是SPA。

主应用程序已加载到此处:

(function() {
    "use strict";

    var app = angular.module("app", [
        "ngAnimate",
        "ngSanitize",
        "ui.router",
        "ui.bootstrap",
        "ui.jq",
        "abp"
    ]);

    //Configuration for Angular UI routing.
    app.config([
        "$stateProvider", "$urlRouterProvider",
        function($stateProvider, $urlRouterProvider) {
            $urlRouterProvider.otherwise("/");
            $stateProvider
                .state("home", {
                    url: "/",
                    templateUrl: "/App/Main/views/home/home.cshtml",
                    menu: "Home" //Matches to name of 'Home' menu in OnderdelenshopNavigationProvider
                })
                .state("about", {
                    url: "/about",
                    templateUrl: "/App/Main/views/about/about.cshtml",
                    menu: "About" //Matches to name of 'About' menu in OnderdelenshopNavigationProvider
                })
                .state("listParts", {
                    url: "/list",
                    templateUrl: "/App/Main/views/parts/list.cshtml",
                    menu: "ListParts"
                });
        }
    ]);
})();

然后当路由到/ list时,加载了以下JS:

(function() {
    var app = angular.module("app");

    var controllerId = "os.views.parts.list";

    app.controller(controllerId, [
        '$scope', 'abp.services.tasksystem.part',
        function($scope, partService) {
            var vm = this;

            vm.localize = abp.localization.getSource("Onderdelenshop");

            vm.parts = [];

            $scope.selectedTaskState = 0;

            $scope.$watch("selectedPartState", function(value) {
                vm.refreshParts();
            });

            vm.refreshParts = function () {
                console.log("test");

                abp.ui.setBusy( //Set whole page busy until getTasks complete
                    null,
                    partService.getParts({ //Call application service method directly from javascript
                        state: $scope.selectedPartState > 0 ? $scope.selectedPartState : null
                    }).success(function (data) {
                        console.log("hey");
                        vm.parts = data.parts;
                    })
                );
            };

            vm.changePartState = function(part) {
                var newState;
                if (part.state === 1) {
                    newState = 2; //Completed
                } else {
                    newState = 1; //Active
                }

                partService.updatePart({
                    partId: part.id,
                    state: newState
                }).success(function() {
                    part.state = newState;
                    abp.notify.info(vm.localize("TaskUpdatedMessage"));
                });
            };

            vm.getPartCountText = function() {
                return abp.utils.formatString(vm.localize("Xparts"), vm.parts.length);
            };
        }
    ]);
})();

这是http://localhost:6234/api/AbpServiceProxies/GetAll?type=angular

(function (abp, angular) {

    if (!angular) {
        return;
    }

    var abpModule = angular.module('abp');

    abpModule.factory('abp.services.tasksystem.person', [
        '$http', function ($http) {
            return new function () {
                this.getAllPeople = function (httpParams) {
                    return $http(angular.extend({
                        abp: true,
                        url: abp.appPath + 'api/services/tasksystem/person/GetAllPeople',
                        method: 'POST',
                        data: JSON.stringify({})
                    }, httpParams));
                };

            };
        }
    ]);


})((abp || (abp = {})), (angular || undefined));


(function (abp, angular) {

    if (!angular) {
        return;
    }

    var abpModule = angular.module('abp');

    abpModule.factory('abp.services.tasksystem.task', [
        '$http', function ($http) {
            return new function () {
                this.getTasks = function (input, httpParams) {
                    return $http(angular.extend({
                        abp: true,
                        url: abp.appPath + 'api/services/tasksystem/task/GetTasks',
                        method: 'POST',
                        data: JSON.stringify(input)
                    }, httpParams));
                };

                this.updateTask = function (input, httpParams) {
                    return $http(angular.extend({
                        abp: true,
                        url: abp.appPath + 'api/services/tasksystem/task/UpdateTask',
                        method: 'POST',
                        data: JSON.stringify(input)
                    }, httpParams));
                };

                this.createTask = function (input, httpParams) {
                    return $http(angular.extend({
                        abp: true,
                        url: abp.appPath + 'api/services/tasksystem/task/CreateTask',
                        method: 'POST',
                        data: JSON.stringify(input)
                    }, httpParams));
                };

            };
        }
    ]);


})((abp || (abp = {})), (angular || undefined));

我可能忘记了什么想法?

更新1:更进一步;控制器定义必须如下:

app.controller(controllerId, [
        '$scope', '$location', 'abp.services.tasksystem.part',
        function ($scope, $location, partService) { ... }

现在收到内部错误,试图修复

1 个答案:

答案 0 :(得分:0)

我想知道你在哪里获得控制器中的abp。你需要注入它