2015-02-14 3 views
2

В menus.client.service.js файл я пытаюсь понять структуру того, как меню в рамках MEAN.js населенКак работает меню MEAN.js?

код начинается с пустым объектом меню, назначенный на эту

this.menus = {} 

, а затем в нижней части файла, функция this.addMenu («topbar») называется

// Add new menu object by menu id 
    this.addMenu = function(menuId, isPublic, roles) { 
     console.log('pre-this.menus') 
     console.log(this.menus) // empty object 

     // Create the new menu 
     this.menus[menuId] = { 
      isPublic: isPublic || false, 
      roles: roles || this.defaultRoles, 
      items: [], 
      shouldRender: shouldRender 
     }; 
     console.log('post-this.menus') 
     console.log(this.menus[menuId]) //complete populated menu with submenus i.e "List Articles", "New Article" 

     // Return the menu object 
     return this.menus[menuId]; 
    }; 

с помощью этой одной функции, кажется, две других функций, которые называются

this.addMenuItem и this.addsubMenuItem

Но я не знаю, как это случилось, потому что я не вижу их явно вызывается в файле.

Я думаю, что здесь отсутствует важная концепция. Я также посмотрел на файл header.client.controller.js, но все это делает вызов функции getMenu и присвоить $ scope.menu

$scope.menu = Menus.getMenu('topbar'); 

Вот полный нефункциональных файл кода

jsfiddle: http://jsfiddle.net/4c5gc0aq/

ответ

7

menus.client.service.js - это только сервис меню, который вводится в блоки запуска модулей.

Элементы меню генерируются (заполняются) из конфигураций модуля. Если вы посмотрите на articles.client.config.js, например, вы увидите, как меню получает заполняется для каждого модуля:

'use strict'; 

// Configuring the Articles module 
angular.module('articles').run(['Menus', 
    function(Menus) { 
     // Add the articles dropdown item 
     Menus.addMenuItem('topbar', { 
      title: 'Articles', 
      state: 'articles', 
      type: 'dropdown' 
     }); 

     // Add the dropdown list item 
     Menus.addSubMenuItem('topbar', 'articles', { 
      title: 'List Articles', 
      state: 'articles.list' 
     }); 

     // Add the dropdown create item 
     Menus.addSubMenuItem('topbar', 'articles', { 
      title: 'Create Articles', 
      state: 'articles.create', 
      roles: ['admin'] 
     }); 
    } 
]); 

я получил этот пример из версии 0.4.0, но я уверен, он очень похож в более ранних версиях.

В нижней части menus.client.service.js вы можете также определить несколько меню, такого как боковое меню, или меню на основе ролей для пользователей, с определенными ролями (например, администраторы):

this.addMenu('top-admin', { 
    isPublic: false, 
    roles: ['admin'] 
}); 
this.addMenu('top-user', { 
    isPublic: false, 
    roles: ['user'] 
}); 

, а затем заполнить их с пунктами меню в блоке конфигурации (запуска) соответствующего модуля. Например:

// Add the articles dropdown item 
Menus.addMenuItem('top-admin', { 
    title: 'Articles', 
    state: 'articles', 
    type: 'dropdown' 
}); 

// Add the dropdown list item 
Menus.addSubMenuItem('top-admin', 'articles', { 
    title: 'List Articles', 
    state: 'articles.list' 
}); 
+0

Совершенный, полностью пропускаемый файл. Большое спасибо! – abcf

+0

Как изменить порядок меню? – Vinay

+1

@Vinay Вам необходимо указать порядок добавляемого меню. Например: функции конфигурационного меню (Меню) { Menus.addMenuItem ('topbar', { названия: 'Cuentas', состояния: 'счета', типа: 'выпадающие', роли: [ '* '], позиция: 1 }); } Вам нужно использовать атрибут >> position. позиция (по желанию: по умолчанию: 0) - указать порядок внешнего вида. –

Смежные вопросы