2

我是角度 js 的新手。我正在尝试构建一个简单的应用程序,如果我通过 ng-route 加载它无法找到 view1.html,而如果我从同一个 index.html 加载它可以工作。我已经通过以下帖子遇到了同样的问题,我们在其中注入了 ng-route 的 ibrary 依赖项,但它仍然无法正常工作

  index.html

 <!DOCTYPE html>
  <html ng-app="demo">
  <head >
  <meta charset="utf-8">
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js">   </script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular-route.min.js">
  </script>
  </head>

  <body> Test 
  <div ng-view=""> </div>
  <script>
    var demo = angular.module('demo',['ngRoute']);
    demo.config(function($routeProvider) {
         $routeProvider.when('/', 
             {
                  controller:'showswitch',
                  templateUrl: 'view1.html'
             })
             .otherwise({redirectTo:'/'})
    });

    demo.controller('showswitch', function($scope) {
        $scope.phones = [
        {'name': 'Nexus S',
        'snippet': 'Fast just got faster with Nexus S.',
            'age': 1},
        {'name': 'Motorola XOOM™ with Wi-Fi',
        'snippet': 'The Next, Next Generation tablet.',
             'age': 2},
        {'name': 'MOTOROLA XOOM™',
            'snippet': 'The Next, Next Generation tablet.',
            'age': 3}
    ];
    });

   </script>
   </body>
   </html>

(view1 和 index 在同一目录下)

view1.html

<div>
<h1> View1 </h1>
<input ng-model="query">
<select ng-model="orderProp">
    <option value="name">Alpha</option>
    <option value="age">Age</option>
</select>
<ul class="phones">
<li ng-repeat="phone in phones | filter:query | orderBy:orderProp">
<span>{{phone.name}}</span>
<p>{{phone.snippet}}</p>
</li>
</ul>
</div>
4

0 回答 0