简体   繁体   English

使用参数为Angular(ui.router)配置路由

[英]Configure Routing for the Angular (ui.router) with a Parameter

Setting up routing for the multi-tenant frontend application using AngularJs and UI-Router. 使用AngularJs和UI-Router为多租户前端应用程序设置路由。

For an example when a user type the following URL the dashboard should be loaded for userxyz and the parameter must be maintained in the user's browser through session, so that the user should be able to browse other hyperlinks within application. 例如,当用户键入以下URL时,应为userxyz加载仪表板,并且必须通过会话在用户的浏览器中维护参数,以便用户应能够浏览应用程序内的其他超链接。

http://servername.com/#/dashboard/userxyz

Am struggling to achieve this, I have watched some tutorials but unable to understand. 为了实现这一目标,我很挣扎,我看了一些教程,但听不懂。

Here is the code for my route configuration. 这是我的路由配置的代码。

(function () {
    'use strict';

    app.config(["$stateProvider", "$urlRouterProvider",
        function ($stateProvider, $urlRouterProvider) {
            $stateProvider
                .state("dashboard", {
                    url: "/dashboard/{tenantid}",
                    templateUrl: "app/components/dashboard/dashboardView.html",
                    controller: "DashboardController"
                })

                .state("people", {
                    url: "/people/{tenantid}",
                    templateUrl: "app/components/people/peopleView.html",
                    controller: "PeopleController"
                })

                .state("contact", {
                    url: "/contact/{tenantid}",
                    templateUrl: "app/components/contact/contactView.html",
                    controller: "ContactController"
                })

                $urlRouterProvider.otherwise("/dashboard/{tenantid}");
        }]);
})();

In my index.html, I have the following code to display the state in ui-view: 在我的index.html中,我有以下代码在ui-view中显示状态:

<div class="row" ui-view>

</div>

And, I did manage to setup the hyperlinks using ui-sref, here how it is: 而且,我确实使用ui-sref设置了超链接,如下所示:

<a ui-sref="dashboard">Home</a>
<a ui-sref="people">People</a>
<a ui-sref="contact">Contact</a>

Better user local o session storage for save the tenant 更好的用户本地o会话存储以节省租户

According with the comments before: 根据之前的评论:

If you don't need support for ie7 (hope so), try to use the native browser localStorage , for insert an item localStorage.setItem('key', 'value') for retrieve localStorage.getItem('key') 如果不需要对ie7的支持(希望如此),请尝试使用本机浏览器localStorage插入项localStorage.setItem('key', 'value')来检索localStorage.getItem('key')

see the localStorage browser support here Local Storage Browser Support 在这里查看localStorage浏览器支持本地存储浏览器支持

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM