用于页面路由和模板/部分/ RESTful API的不同基本URL

时间:2013-07-12 22:49:40

标签: angularjs angularjs-routing

我的Angular应用程序被分成几个子应用程序。我正在使用laravel,它也负责子应用程序之间的路由。

因此laravel处理以下网址:

ModuleX:/moduleX
模块Y:/moduleY
ModuleZ,项目n:/moduleZ/item-n(无限数量的项目)

最后在这些上面有我的3个Angular子应用程序。 例如:
/moduleZ/item-1/#/hello/world

此外,模板,局部文件和RESTful API由以下网址下的laravel提供:

/templates
/partials
/api

如果我使用html标签<base href="http://www.example.com/app/">设置基本网址,我可以使用模板,部分和api的相对网址,但不能使用路由。我总是不得不像moduleX/#/hello/world那样添加模块url部分。

如果我设置基本网址,例如<base href="http://www.example.com/app/moduleX/">,我可以编写所有链接,例如#/hello/world,但模板,部分和api请求不再有效。

整个应用程序也位于子文件夹中,所以我不能只使用例如/templates

所以基本上我的问题或现在的问题是,处理不同基本网址的最佳方法是什么?我真的不喜欢将模块名称添加到每个链接。

3 个答案:

答案 0 :(得分:3)

看起来它可能是一个特殊的解决方案,但您可能应该使用过滤器作为网址? 例如:

.filter('routeFilter', [function () {
        return function (route) {

            if (some condition mean this direct html link){
                return 'MODULE-X/' + route;
            }else{
               return route  
            }

        };
    }])

答案 1 :(得分:2)

我建议你让(子)应用知道他们的真实基础,而不是父母的应用,但是你要让服务器负责攀登路径层次结构,找到更高级别的共享资源,以便找到丢失的本地资源。这也使得新的子应用程序原型非常容易,首先独立测试对常见部分的更改等等。

在像Apache这样的网络服务器中,这看起来像一个重写规则(以找不到文件为条件),它只是替换父层次结构中的同一个文件。

在laravel中(根据路由器文档),您可以在当前规则中添加可选的“目录”,即:

Route::get('/.../app/templates/{name}', function($name)
...

变为:

Route::get('/.../app/{module?}/{item?}/templates/{name}', function($name, $module, $item)
...

如果您需要使用特定的子应用/项目测试资源更改,则可以使用$ module和$ item。

使服务器负责处理继承的缺点是具有不同路径的相同资源的独立客户端提取/缓存。但是,您至少可以通过使用重写或重定向来选择大文件低效率或访问延迟。您也可以在以后对生产客户端中的重要路径进行硬编码,并且仍然可以通过在客户端链接中进行测试和优雅处理偶然错误的层次结构而受益。

答案 2 :(得分:2)

如果您使用服务和指令的组合,则可以以更简单的方式执行此操作。

您可以实现类似于ngHref的指令,当给定链接时,它将对其进行转换并将给定的链接追加回来。它将注入一个服务,该服务将为其提供基本URL或相对URL或任何特定模块。

此指令中注入的服务将使用每个子应用程序的app.config块中的serviceProvider进行配置。由于角度注入器只有每个服务的一个实例,我认为每个子应用程序需要多个注入器或一个注入器。目前还不清楚他们是否在你的应用程序中共享喷射器。

您可以根据模块配置每个服务以返回不同的基本路径。每次都会将指令附加到每个链接。

有了这个,您可以使用<base href="http://www.example.com/app/">,这可以解决您的问题。

我没有编写任何代码,但如果您需要,我可以提供帮助。