将 Angular $routeProvider 与打包的应用程序一起使用答案

【问题标题】：Using angular $routeProvider with packaged apps将 Angular $routeProvider 与打包的应用程序一起使用
【发布时间】：2013-09-14 12:05:35
【问题描述】：

我正在使用 AngularJS 构建一个 Chrome 打包应用程序，使用 $routeProvider 似乎非常可取，但是这些方法似乎与应用程序内的 URL 系统不匹配。

所以我的问题是我可以在 Chrome 打包应用程序中实现 $routeProvider 功能吗？如果可以，如何实现？

【问题讨论】：

我的 chrome 打包应用程序（角度 1.4 / chrome 43）中的 $routeProvider 没有任何问题 - 你能确认问题不再存在吗？我发现的唯一问题是使用 $routeProvider 的 html5 模式，这在 chrome 应用程序中不起作用。

标签： angularjs google-chrome-app

【解决方案1】：

不确定这是否是最好的解决方案，但我似乎自己解决了这个谜。

根据您的需要设置 $routeProvider，而不是在应用程序中使用链接，而是使用 ng-click 指令，该指令使用 $location 将路径更改为与您的 $routeProvider 路径匹配的任何内容。

在下面的示例中，我创建了一个“链接”指令，将 $location.path 设置为单击时的任何值。

#coffescript:
app.directive "link", ($location) ->
    (scope, element, attrs) ->
      element.bind "click", ->
        scope.$apply $location.path(attrs.link)

app.config ($routeProvider) ->
  $routeProvider

    .when "",
      templateUrl: "index.html"

    .when "/otherPage",
      templateUrl: "path/to/otherPage.html"

    .otherwise
      template: "Fail!"

空字符串路由匹配应用的初始状态。

无论链接属性附加到什么，都将成为可点击的链接。

<button link="otherPage">Take me to otherPage</button>
<div link="otherPage">Make divs clickable too why not?</div>

【讨论】：

我也遇到了同样的问题，您已经找到更好的解决方案了吗？这看起来有点像解决方法 hack :-)