Angularjs 播放框架：如何在资产文件中使用反向路由？_Angularjs_Playframework

Angularjs 播放框架：如何在资产文件中使用反向路由？

angularjs playframework

Angularjs 播放框架：如何在资产文件中使用反向路由？,angularjs,playframework,Angularjs,Playframework,对于使用Play Framework和AngularJs的应用程序，我有以下文件： app/views/index.scala.html app/assets/app/app.js app/assets/app/app.scss app/assets/app/main/_main.scss app/assets/app/main/main.controller.js app/assets/app/main/main.html app/assets/app/main/main.js app/ass

对于使用Play Framework和AngularJs的应用程序，我有以下文件：

app/views/index.scala.html
app/assets/app/app.js
app/assets/app/app.scss
app/assets/app/main/_main.scss
app/assets/app/main/main.controller.js
app/assets/app/main/main.html
app/assets/app/main/main.js
app/assets/components/navbar/navbar.controller.js
app/assets/components/navbar/navbar.directive.js
app/assets/components/navbar/navbar.html

scss

文件位于

app/assets

中，因此

sbt sassify

插件将它们编译成

css

。其他视图（

js

和

html

文件）也在

app/assets

中，但我可以将它们公开

conf/routes

包含：

GET     /assets/*file               controllers.Assets.versioned(path="/public", file: Asset)

navbar.directive.js

如下所示：

angular.module('quotesApp')
  .directive('navbar', () => ({
    templateUrl: 'components/navbar/navbar.html',
    restrict: 'E',
    controller: 'NavbarController',
    controllerAs: 'nav'
  }));

这将不起作用，因为模板URL

components/navbar/navbar.html

路径需要以

/assets/

作为前缀，正如

conf/routes

文件中定义的那样

那么，解决这个问题的正确形式是什么

我是否应该在文件

navbar.directive.js

中硬编码前缀

/assets

，如下所示？但是，在更改管线定义时，这将被打破

angular.module('quotesApp')
  .directive('navbar', () => ({
    templateUrl: '/assets/components/navbar/navbar.html',
    restrict: 'E',
    controller: 'NavbarController',
    controllerAs: 'nav'
  }));

我是否应该创建一个视图

app/views/components/navbar/navbar.directive.scala.js

（但这只是使用

routes

函数的一个样板文件）：

还有其他解决办法吗？可能是某种相对路径？

您可以在

index.scala.html

中定义该路径，然后再在angular指令中使用它：

<head>
    <!-- Something -->
    <script>
        window.MyApp = {
            'navBarPath': '@routes.Assets.versioned("components/navbar/navbar.html")';
        };
    </script>
</head>

这并不完美，但我认为这是实现你想要的最简单的方法

<head>
    <!-- Something -->
    <script>
        window.MyApp = {
            'navBarPath': '@routes.Assets.versioned("components/navbar/navbar.html")';
        };
    </script>
</head>

// (...)
templateUrl: MyApp.navBarPath,