abp添加菜单

在abp模板中添加菜单，entityframework+angular.js模板，使用的abp版本为3.8.1。

创建abp项目模板，例如名称叫做lawandregulation。

服务端添加菜单项

找到mpa或者spa项目，也就是lawandregulation.webmpa或者lawandregulation.webspaangular。

项目中找到lawandregulationnavigationprovider类，在类中找到setnavigation方法，按照模板中提供的菜单添加方法添加menuitemdefinition。

menuitemdefinition即为我们需要添加的菜单项，菜单项包含几个重要的属性：

• 【name】，菜单项名称，在view层添加菜单项时对应的名称；
• 【displayname】，显示名称，本地化显示在名称，也就是多语言需要解释的名称；
• 【url】，导航的路由名称；
• 【icon】，图标名称；
• 【requireauthentication】，登陆认证及权限认证；

设置好这几项后在服务端导航的内容已经设置完成。

示例代码：

public class lawandregulationnavigationprovider : navigationprovider
    {
        public override void setnavigation(inavigationprovidercontext context)
        {
            context.manager.mainmenu
                .additem(
                new menuitemdefinition(
                    "dictionarymanager",
                    l("dictionarymanager"),
                    url: "#dictionarymanager",
                    icon: "fa fa-info",
                    requiresauthentication: true
                    )
                    );
        }

        private static ilocalizablestring l(string name)
        {
            return new localizablestring(name, lawandregulationconsts.localizationsourcename);
        }
    }

客户端添加菜单

在lawandregulation.webspaangular项目中找到app/main/views/layout/sidebar-nav.js文件，在文件中编辑属性menuitems，属性menuitems为数组，在数组中添加对象通过createmenuitem方法，方法中参数：

• 1.本地化标题；
• 2.权限名称；
• 3.图标名称；
• 4.路由名称，也可以是url链接；
• 5.子项集合，可选参数；

实例代码：

vm.menuitems = [
                createmenuitem(app.localize("homepage"), "", "home", "home"),

                createmenuitem(app.localize("tenants"), "pages.tenants", "business", "tenants"),
                createmenuitem(app.localize("users"), "pages.users", "people", "users"),
                createmenuitem(app.localize("roles"), "pages.roles", "local_offer", "roles"),
                createmenuitem(app.localize("lawandregulation"), "", "info", "lawandregulation"),
                createmenuitem(app.localize("about"), "", "info", "about")
];

 其中lawandregulation为我们添加的菜单项。

客户端添加路由

在webspaangular项目中找到app.js文件，app.js文件在app/mian/路径下。

找到app.config，在function方法中找到回调函数中$stateprovider参数，调用参数的state方法。

state方法有两个参数：

• 【navigationname】字符串，导航名称；
• 【route】对象，对象包含三个属性，服务端url、客户端页面url以及菜单名称（本地化的名称）；

设置完以上，客户端路由已经设置完成。

实例代码如下：

            $stateprovider
                .state('dictionarymanager', {
                    url: '/dictionarymanger',
                    templateurl: '',
                    menu:'dictionarymanager'
                });