AngularJS菜单是MEAN.js中的公共

Question

I'm creating a webapp using MEAN.js and I'm running into an issue with the nav menu.

There are a few questions that seem related to my issue, but none of the answers solve it for me, and it seems like most of them are attributed to a documentation error.

I'm trying to set a menuItem to public, and this is how I am doing it in my core.client.config.js:

Menus.addMenuItem('topbar', 'About Us', 'about', 'item', '/about', true, null, 1);

Everything specified works, even the ordering. However the public true parameter does not do anything.

Currently I just set the entire topbar to isPublic in menus.client.service.js, but this is not ideal as I would like to control who can see what!

this.addMenu('topbar', true);

Any help would be appreciated!

Answer 1

The problem lies in the public/modules/core/services/menus.client.service.js The shouldRender function, which is called for the menu, each item and sub-item, doesn't check for isPublic. So just add:

// A private function for rendering decision 
var shouldRender = function(user) {
    if(this.isPublic){
        return true;
    }
    ...
}

and change the last line to:

//Adding the topbar menu
this.addMenu('topbar', true);

because otherwise the menu itself is never rendered.

Now you can call addMenuItem and addSubMenuItem like this:

Menus.addMenuItem('topbar', 'Articles', 'articles', 'dropdown', '/articles(/create)?', <true/false>);
Menus.addSubMenuItem('topbar', 'articles', 'List Articles', 'articles');
Menus.addSubMenuItem('topbar', 'articles', 'New Article', 'articles/create');

Note if you don't provide true or false, the menu-items are going to inherit from their parent. As we set the menu to public every child is public. As soon as we set a menu item private the children are also private.

If you want to change the SubMenu visibility be careful with the amount of arguments. The sixth argument has to be true.

Menus.addSubMenuItem('topbar', 'articles', 'List Articles', 'articles');

^^ changes to vv

Menus.addSubMenuItem('topbar', 'articles', 'List Articles', 'articles', '/articles', true);

You can of course change the functions signature to avoid this. Just swap menuItemUIRoute and isPublic in menus.client.service.js

 // Add submenu item object
this.addSubMenuItem = function(menuId, rootMenuItemURL, menuItemTitle, menuItemURL, isPublic, menuItemUIRoute, roles, position) {
    // Validate that the menu exists

Then you can add the SubMenu like this:

Menus.addSubMenuItem('topbar', 'articles', 'List Articles', 'articles', true);