如何创建不使用路由的AngularJS SPA应用程序？

Question

我想创建一个仅使用一个HTTP域，.com之后不包含任何内容的AngularJS应用程序。 例如，其中这是浏览器中唯一显示的URL的应用程序：

www.myapp.com

这可能吗，我需要做什么？ 到目前为止，我所看到的所有应用程序都使用类似以下内容的东西：

www.myapp.com/users
www.myapp.com/screen1

等等

Answer 1

当然; 您所需要的只是某种顶级应用程序状态和响应该状态的UI。 这就是ngRoute的全部ngRoute -状态仅位于您的地址栏中，而如何响应该状态的配置位于$routeProvider （这又通过ngView指令在DOM中实现）。

考虑以下简单示例：

<div ng-controller="ApplicationController">
  <h1>Some Pages</h1>
  <ul>
    <li><a href='' ng-click='setPage("page1")'>Page 1</a></li>
    <li><a href='' ng-click='setPage("page2")'>Page 2</a></li>
    <li><a href='' ng-click='setPage("page3")'>Page 3</a></li>
  </ul>

  <div ng-include="page + '.html'"></div>
</div>

app.controller('ApplicationController', function($scope) {
  $scope.page = 'page1';

  $scope.setPage = function(pg) {
    $scope.page = pg;
  }
});

您可以在下面的Plunker中看到它的工作原理： http ://plnkr.co/edit/hpnGtMkV6V4JtPRrQmes?p=preview

单击全屏按钮，以便您可以看到地址栏（以及它不变的事实）。

---

如果不将应用程序状态存储在地址栏中，用户就没有一种非常简单的方法来标记自己在应用程序中的位置或使用浏览器的按钮前进/后退，这毫无价值。 仔细考虑您是否正在构建可从这种限制中受益的应用程序。

Answer 2

路由通常是为了使应用程序的不同部分更具“可标记性”而实现的。

因此，尽管您可能拥有SPA，但是您仍然可能希望用户使用URL栏使他们回到应用程序的特定部分。

如果仅将起始页设置为index.html，则无需指定页面名称即可使用。