$routeParams在传递到新视图时未定义&控制器

$routeParams undefined when passing to new view & controller

本文关键字:未定义 amp 控制器 新视图 routeParams      更新时间:2023-09-26

这里是AngularJS和WebAPI的新手,最好的学习方式是动手。如果这个问题看起来很简单,请提前道歉——我花了一天时间浏览了StackOverflow,并尝试了所有内容。

我目前有一个单独的主&局部视图,两者都有自己的控制器。我正试图将所选的ID传递给Details控制器,这样我就可以使用该ID查询我的数据库,尽管我的$routeParams上出现了"未定义"。我不确定我是否错过了一些简单的东西,或者我是否正确地处理了这个问题。

当我注入"$routeParams"时,控制器似乎也不喜欢它。

我的app.js模块:

var app = angular.module("ProjectDashboardModule", ["ngRoute"]);
app.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
    $routeProvider
        .when("/", { templateUrl: "/Home/Index" })
        .when("/Project", { templateUrl: '/Project/Index', controller: 'ProjectCrudController' })
        .when("/Project/project/:id", {templateUrl:'/Project/project', controller: 'ProjectTaskController' });
    $routeProvider.otherwise({redirectTo: '/home' });
    $locationProvider.html5Mode(true);
}]);

myFactory.js:

app.factory('projectFactory', ['$http', function ($http) {
    var urlBase = '/api/Projects/';
    var projectFactory = {};
    projectFactory.getProjects = function () {
        return $http.get(urlBase);
    };    
    projectFactory.getSingleProject = function (id) {
        return $http.get(urlBase + '/' + id);
    };    
    return projectFactory;
}]);

我的ProjectTaskController.js:

app.controller('ProjectTaskController', ['$scope', "$routeParams", 'projectFactory', function ($scope, $routeParams, projectFactory) {
    alert($routeParams.id)
    $scope.project;
    $scope.message;
    getProjectById($routeParams.id);    
    function getProjectById(id) {
        projectFactory.getSingleProject(id)
        .success(function (data) {
            $scope.project = data;
        })
        .error(function (error) {
            $scope.message = 'error retrieving project ' + error.message;
        });
    }
 }]);

我发现我的问题是所有有角度的脚本引用都分散了。我将所有自定义脚本引用(控制器、工厂、模块)移到了index.cshtml,并修复了这个问题。