0

我正在学习 Angularjs，我正在从http://angularjs.org/做教程，但我无法得到我想要的东西。我有一个简单的页面 index.html：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="ISO-8859-1">
    <title>Home</title>
  </head>
  <body>
    <ul>
      <li><a href="helloWorld.html">Hello World</a></li>
      <li><a href="tasks.html">Tasks</a></li>
      <li><a href="projects.html">Projects</a></li>
      </ul>
  </body>
</html>

我希望当我点击projecst.html我的网址时会显示类似http://localhost:8080/Application/projects或http://localhost:8080/Application/#/projects或http://localhost:8080/Application/#!/projects或其他的东西，但我不希望它显示http://localhost:8080/Application/projects.html 我一直在用和进行测试$routeProvider，但我不太了解它们是如何工作的，谁能解释一下它给我？有人可以帮我解决这个问题吗？$locationProvider$location

更多信息：projects.html：

<!DOCTYPE html>
<html ng-app="project">
  <head>
    <title>AngularJS | Projects</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular-resource.min.js"></script>
    <script type="text/javascript" src="https://cdn.firebase.com/v0/firebase.js"></script>
    <script type="text/javascript" src="http://firebase.github.io/angularFire/angularFire.js"></script>
    <script type="text/javascript" src="js/projects.js"></script>
  </head>
  <body>
    <h2>JavaScript Projects</h2>
    <div ng-view></div>
  </body>
</html>

项目.js：

angular.module('project', ['firebase']).
  value('fbURL', 'https://angularjs-projects.firebaseio.com/').
  factory('Projects', function(angularFireCollection, fbURL) {
    return angularFireCollection(fbURL);
  }).
  config(function($routeProvider) {
    $routeProvider.
      when('/', {templateUrl:'list.html', controller:ListController}).
      when('/edit/:projectId', {templateUrl:'edit.html', controller:EditController}).
      when('/new', {templateUrl:'edit.html', controller:NewController}).
      otherwise({redirectTo:'/'});
  });

提前致谢！

问候。

4

2 回答 2

0

您可以使用“index.html”作为主机页面来解决此问题并部署在真实的网络服务器上。您还可以将您的网络服务器配置为接受“projects.html”作为索引文件或欢迎文件。

然后，您在 Angular 应用程序中设置路由，如下所示：

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

app.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/projects', {
templateUrl: 'partials/project-list.html',
controller: 'MyCtrl'
});
}]);

确保以正确的方式链接到它，因此您的 html 应该是

<li><a href="#!/projects.html">Projects</a></li>
于 2013-10-21T08:53:08.527 回答
0

$routeProvider 您应该使用http://docs.angularjs.org/tutorial/step_07定义 URL 。不要将您的 href 指向 *html。将它们指向您定义的网址。

那么您还可以将其配置为$routeProviderHTML5 模式或 hashbang（默认）模式-

于 2013-10-21T08:54:12.480 回答