javascript - 错误: [$controller:ctrlreg] The controller with the name 'CreatePortfolioController' is not registered

Question

ng-app 添加在 html 标签中。我只添加了一部分 html 代码。我正在尝试使用 CreatePortfolioController 但它似乎未定义。我也检查了拼写错误，但似乎没有。我不知道为什么它不起作用。你能帮我调试一下吗？

应用程序.js

var app = angular.module("UiApp", ["ServiceApp"]);

app.service('sharedProperties', function () {
    var idValue = 'test string value';

    return {
        getId: function () {
            return idValue;
        },
        setId: function (value) {
            idValue = value;
        }
    }
});

app.controller("PortFolioController", function ($scope, GetPortfolios, sharedProperties) {
    $scope.Portfolios = GetPortfolios.query({ pmid: 2 });
    console.log($scope.Portfolios);
    $scope.addOrder = function (id) {
        sharedProperties.setId(id)
    };
});

app.controller("CreatePortfolioController", function ($scope, CreatePortfolio) {
    $scope.create = function (data) {
        CreatePortfolio.save(data);
    };
});

app.controller("OrderController", function ($scope, GetOrders, sharedProperties) {
    $scope.$watch(function () {
        return sharedProperties.getId()
    }, function (newValue, oldValue) {
        if (newValue != oldValue) {
            $scope.item = newValue;
            $scope.Orders = GetOrders.query({ id: item });
        }
    });
});

服务.js

var app = angular.module("ServiceApp", ["ngResource"]);

    app.factory('GetPortfolios', function ($resource) {
        return $resource("http://localhost:61347/api/PortfolioManager/GetPortfolios/");
    });

    app.factory('GetOrders', function ($resource) {
        return $resource("http://localhost:61347/api/PortfolioManager/GetPortfolioOrders/");
    });

    app.factory('CreatePortfolio', function ($resource) {
        return $resource("http://localhost:61347/api/PortfolioManager/CreatePortfolio");
    });

HTML

<div class="panel-body">
                                <div class="form" ng-controller="CreatePortfolioController">
                                    <form class="cmxform form-horizontal " id="signupForm" method="get" ng-submit="create(data)" action="">
                                        <div class="form-group ">
                                            <label for="portfolioname" class="control-label col-lg-3">Portfolio Name</label>
                                            <div class="col-lg-6">
                                                <input class= "form-control" ng-model="data.portfolioName"  name="portfolioname" type="text" required />
                                            </div>
                                        </div>
                                        <div class="form-group ">
                                            <label for="portfoliotype" class="control-label col-lg-3">Portfolio Type</label>
                                            <div class="col-lg-6">
                                                <input class= "form-control" ng-model="data.type"  name="portfoliotype" type="text" required />
                                            </div>
                                        </div>
                                        <div class="form-group ">
                                            <label for="portfoliodesc" class= "control-label col-lg-3">Portfolio Description</label>
                                            <div class="col-lg-6">
                                                <textarea class="form-control " ng-model="data.description"  name="portfoliodesc" rows="3"></textarea>
                                            </div>
                                        </div>                                       
                                        <div class="form-group">
                                            <div class="col-lg-offset-3 col-lg-6">
                                                <button class="btn btn-primary" type="submit">Save <i class="fa fa-check"></i></button><!--Write Save code-->
                                                <button class="btn btn-primary" type="reset">Cancel <i class="fa fa-times"></i></button><!--Write clear text box code-->
                                            </div>
                                        </div>
                                    </form>
                                </div>
                            </div>

导入文件的顺序

<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/angular-resource.js"></script>
<script src="~/AngularScripts/PM/App.js"></script>
<script src="~/AngularScripts/PM/Service.js"></script>

Answer 1

请检查所有这些条件:

1. 您的ng-app包含在 ng-controller 之前在 HTML 页面中或一起在同一个标​​签中。
2. 检查 Controller 的名称，因为它区分大小写。
3. 确保您已在 HTML 页面中正确加载 JS 文件。 AngularJS 库的 JS 文件，然后是您的应用程序文件依次包含带有 ng-app 集的 JS 文件、定义服务(如果有)，定义工厂的js文件(如果有)，定义 Controller 的 js 文件。确保你不会错过包含所有 js 文件并且顺序正确。

因为我没有看到 <script> 中包含 Controller 文件，在您添加的代码片段中。