Question

//app.js
(function () {
    var app = angular.module('app', ['ngRoute']);

    app.config(function ($routeProvider) {

        $routeProvider.when('/',
        {
            controller: 'customersController',
            templateUrl: '/app/views/customers.html'
        }).otherwise({ redirectTo: '/' });
    });
}());

我有/app/app.js和/app/views/customers.html /app/customersController.js。

下面是html

<!DOCTYPE html>
<html ng-app="app">
<head> 
</head>
<body>

    <div class="container body-content">

        <div class="row">
            <div class="col-md-12">
                <div ng-view></div>
            </div>
        </div>




    </div>

    <script src="/Assets/Scripts/jquery-1.10.2.js"></script>

    <script src="/Assets/Scripts/bootstrap.js"></script>
<script src="/Assets/Scripts/respond.js"></script>

    <script src="/Assets/Scripts/angular.min.js"></script>
    <script src="/Assets/Scripts/angular-route.min.js"></script>
    <script src="/app/app.js"></script>
    <script src="/app/customersController.js"></script>

</body>
</html>

这是控制器：

(function () {

    var customersController = function customersController($scope) {
        $scope.sortBy = 'name';
        $scope.reverse = false;


        $scope.customers = [{ name: 'foo', city: 'ny' }, { name: 'bar', city: 'la' }];

        $scope.doSort = function (propname) {
            $scope.sortBy = propname;
            $scope.reverse = !$scope.reverse;
        };
    };

    customersController.$inject = ['$scope'];
    angular.module('app', []).controller('customersController', customersController);

}());

customers.html如下：

test


<div>
    <table>
        <tr>
            <td>Name</td>
            <td>City</td>
        </tr>

        <tr ng-repeat="customer in customers ">
            <td>{{customer.name}}</td>
            <td>{{customer.city}}</td>
        </tr>
    </table>
</div>

它不会加载customers.html，更不用说test文字了。

问题出在哪里？

Answer 1

我认为你正在重新定义你的模块。尝试更改此行

angular.module('app', []).controller('customersController', customersController);

到此：

angular.module('app').controller('customersController', customersController);

ng-view无法呈现

1 个答案: