4

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

因此，laravel 处理了以下 url：

ModuleX：/moduleX
ModuleY：/moduleY
ModuleZ，项目n：（项目/moduleZ/item-n数量不限）

最后还有我的 3 个 Angular 子应用程序。例如：
/moduleZ/item-1/#/hello/world

此外，模板、部分和 RESTful API 由 laravel 在以下 url 下提供：

/templates
/partials
/api

如果我使用 html 标记设置基本 url，<base href="http://www.example.com/app/">我可以将相对 url 用于模板、部分和 api，但不能用于路由。我总是必须像这样添加模块 url 部分moduleX/#/hello/world。

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

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

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

4

3 回答 3

3

看它可能是一个特定的解决方案，但可能你应该对 url 使用过滤器？例如：

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

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

        };
    }])
于 2013-07-26T10:14:45.637 回答
2

I would suggest you let (sub-)apps know their real base not the parent's one, but you make the server responsible for climbing the path hierarchy to find higher level shared resources for missing local ones. This also makes it very easy to prototype new sub-apps, test changes to common pieces independently first, etc.

In a webserver like Apache, this would look like a rewrite rule (conditional on not finding a file) it just substitutes the same file in the parent hierarchy.

In laravel (according to the router docs) it looks like you can add optional 'directories' to your current rules, i.e.:

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

becomes:

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

You could then use $module and $item if you need to test a resource change with specific sub-app/items.

The drawback in making the server responsible for handling inheritance is the independent client fetch/cache of identical resources with different paths. But you can at least choose between large file inefficiency or access latency by using either rewrites or redirects. You can also always hardcode significant paths in production clients later and still benefit from having a hierarchy for testing and graceful handling of occasional errors in client side links.

于 2013-07-27T12:11:55.480 回答
2

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

你可以实现一个类似于 ngHref 的指令，当给定一个链接时，它会转换它并将给定的链接附加回来。它将被注入一个服务，该服务将为其提供基本 url 或相对 url 或任何特定于模块的内容。

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

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

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

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

于 2013-07-30T11:50:56.480 回答