Question

学习Angular JS，并关注来自http://www.youtube.com/watch?v=i9MHigUZKEM的视频 - 我收到了AngularJS错误，但不知道它是什么，坦率地说，如何调试这个东西....使用AngularJS 1.2.3 ，顺便说一句。

这是主页：

<html data-ng-app="demoApp">
<head>
    <title></title>

</head>
<body >
<div>
<!-- placeholder for views -->
<div data-ng-view=""></div>
<!-- placeholder up to here -->
</div>
<script src="angular.min.js"></script>

    <script>

        var demoApp = angular.module('demoApp',[]);

        demoApp.config(function ($routeProvider) {
            $routeProvider
                .when('/view1',
                {
                    controller: 'SimpleController',
                    templateUrl: 'Partials/view1.html'
                })
                .when('/view2/',
                {
                    controller: 'SimpleController',
                    templateUrl: 'Partials/view2.html'
                })
                .otherwise({ redirectTo: '/view1' });
        });

        demoApp.controller('SimpleController', function ($scope) {
            $scope.customers = [
                {name:'john',city:'phoenix'},
                {name:'jane',city:'sf'},
                {name:'jon',city:'Oakland'}
            ];

            $scope.addCustomer = function() {
                $scope.customers.push(
                    { 
                        name: $scope.newCustomer.name,
                        city: $scope.newCustomer.city
                    });
            };
        });


    </script>

</body>
</html>

和视图1.html：

<div class="container">
    <h1>view 1</h1>
    Name: <br />
    <input type="text" data-ng-model="filter.name" />

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

和View2.html

<div id="container" >
    <h1>view 2</h1>
    Name: <br />
    <input type="text" data-ng-model="filter.city" />

    <ul>
        <li data-ng-repeat="cust in customers | filter:filter.city">{{ cust.name | uppercase }} - {{ cust.city | lowercase }}</li>
    </ul>
</div>

我错过了什么？

Answer 1

您需要确保包含angular-route.js，此处http://code.angularjs.org/1.2.3/angular-route.js

还要确保指定demoApp对ngRoute模块的依赖性。

var demoApp = angular.module('demoApp', ['ngRoute']);

如果您按照错误消息中发布的链接进行操作，则会在那里看到一些详细信息。

AngularJS代码错误 - 我缺少什么？

1 个答案: