Question

不要看到我在这里失踪的东西。我的javascript并没有抛出任何错误，但是当我运行主页时，我得到的只是一个空白屏幕;似乎view1.htm没有加载。

这是主要页面：

<!doctype HTML>
<html ng-app="demoApp">
    <!--- This is how you integrate with partials (views)... --->
    <head>
        <title>Using AngularJS Views</title>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.min.js"></script>
        <!-- normally would put this in it's own js file and call with script src="" -->
        <script>
            var demoApp = angular.module('demoApp', ['ngRoute']);

            demoApp.config(function ($routeProvider) {
                $routeProvider
                .when("/",
                        {
                            controller:"simpleController",
                            templateURL:"partials/view1.htm"
                        })
                .when("/view2",
                        {
                            controller:"simpleController",
                            templateURL:"partials/view2.htm"
                        })
                .otherwise({ redirectTo: "/"});
            });


            demoApp.controller('simpleController', ['$scope', function($scope) {
                $scope.customers = [
                        {name:"David Jones", city:"Phoenix"},
                        {name:"James Riley", city:"Atlanta"},
                        {name:"Heedy Wahlin", city:"Chandler"},
                        {name:"Thomas Winter", city:"Seattle"}
                ];

                $scope.addCustomer = function(){
                    $scope.customers.push(
                        {name: $scope.newCustomer.name, city: $scope.newCustomer.city}
                    );
                };
            }]);                
        </script>
    </head>
    <body>
        <div>
            <!-- placeholder for the views -->
            <div ng-view></div>
        </div>
    </body>
</html>

和这里的部分/ view1.htm：

<div class="container">
    <h2>View 1</h2>
    Name:
    <br/>
    <input type="text" ng-model="filter.name" />
    <br/>
    <ul>
        <li ng-repeat="cust in customers | filter:filter.name">{{cust.name}}</li>
    </ul>
    <br/>
    Customer Name:<br/>
    <input type="text" ng-model="newCustomer.name" />
    <br/>
    Customer City:<br/>
    <input type="text" ng-model="newCustomer.city" />
    <br/>
    <button ng-click="addCustomer()">Add Customer</button>
    <a href="#/view2.htm">View 2</a>
</div>

感谢您的帮助。

Answer 1

找到它。 templateURL应该是templateUrl。

视图不会加载到AngularJS中

1 个答案: