为单页应用程序(SPA)创建一个链接，使其位于不同的选项卡上

Question

我正在使用AngularJs开发一个单页面应用程序。根据用户选项，显示/隐藏各自的视图。

​

​

我的网址是localhost:8086/portal/和默认登录页面是仪表板。

但是，有一个要求:我需要在另一个页面上给出一个链接，而不是给出localhost:8086/portal/，默认情况下，它应该会出现在Reports页面上。因为，我正在开发SPA，我的网址不会改变，但在这种情况下，我需要登陆相同的网址与不同的登录页面，通过点击不同的链接。

Answer 1

我的解决方案是使用URL重写，这样您仍然可以登录到SPA页面，但使用不同的URL。路由引擎将获取此信息并加载正确的模板。

.NET web.config示例。

<rule name="NewsByEmail">
   <match url="^newsbyemail/" />
   <action type="Rewrite" url="/app/newsbyemail/index.html" />
</rule>

<rule name="NewsByEmailUnsubscribe">
   <match url="^newsbyemail/unsubscribe/" />
   <action type="Rewrite" url="/app/newsbyemail/index.html" />
</rule>

角度布线。

myApp.config(
    ($routeProvider, $locationProvider) => {
        $routeProvider
            .when("/newsbyemail/", {
                templateUrl: "app/newsbyemail/subscribe/subscribe.html"
            }).when("/newsbyemail/unsubscribe/", {
                templateUrl: "app/newsbyemail/unsubscribe/unsubscribe.html"
            });

        $locationProvider.html5Mode(true);
    }
);