- \n
- \u0412\u0441\u044f \u043d\u0430\u0447\u0438\u043d\u043a\u0430 \u043c\u0435\u043d\u044e \u0441\u043f\u0440\u044f\u0442\u0430\u043d\u0430 \u043f\u043e\u0434 \u043a\u0430\u043f\u043e\u0442\u043e\u043c \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b. \u041f\u0440\u0438 \u0432\u0435\u0440\u0441\u0442\u043a\u0435 html \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043b\u0438\u0448\u044c DOM-\u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0441 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u043e\u0439, \u0447\u0442\u043e \u043f\u043e\u0432\u044b\u0448\u0430\u0435\u0442 \u0447\u0438\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u043a\u043e\u0434\u0430.<\/li>\n
- \u0423 \u043c\u0435\u043d\u044e \u0435\u0441\u0442\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043f\u0443\u043d\u043a\u0442\u044b \u0441 \u0431\u0435\u0441\u043a\u043e\u043d\u0435\u0447\u043d\u044b\u043c \u0443\u0440\u043e\u0432\u043d\u0435\u043c \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0435\u0439.<\/li>\n
- \u041f\u043e\u0434\u0441\u0432\u0435\u0442\u043a\u0430 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0432 \u043c\u0435\u043d\u044e \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430 \u043f\u0435\u0440\u0432\u043e\u043c \u0443\u0440\u043e\u0432\u043d\u0435, \u043d\u043e \u0438 \u043d\u0430 \u043b\u044e\u0431\u043e\u043c \u0443\u0440\u043e\u0432\u043d\u0435 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438.<\/li>\n
- \u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0437\u0430\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u0443\u043d\u043a\u0442 \u043c\u0435\u043d\u044e \u043d\u0430 \u044d\u0442\u0430\u043f\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/li>\n
- \u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f\/\u0441\u043e\u043a\u0440\u044b\u0442\u0438\u044f \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0445 \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043f\u0440\u0430\u0432 \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f.<\/li>\n<\/ol>\n
\u0418\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u0434 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0442\u0443\u0442<\/a><\/b>.
<\/a>
\u041f\u0438\u0441\u0430\u0442\u044c \u0432\u0441\u0435 \u0441 \u043d\u0443\u043b\u044f, \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u044f \u043d\u0435 \u0441\u0442\u0430\u043b, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043d\u0438\u0436\u0435 \u043f\u0440\u0438\u0432\u043e\u0436\u0443 \u0441\u043f\u0438\u0441\u043e\u043a \u043f\u043e\u0437\u0430\u0438\u043c\u0441\u0442\u0432\u043e\u0432\u0430\u043d\u043d\u044b\u0445 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u043e\u0432<\/u>:<\/p>\n\u041f\u0440\u043e\u0441\u043c\u043e\u0442\u0440 \u0441\u043f\u0438\u0441\u043a\u0430<\/b><\/p>\n\n- \n
- AngularJS<\/a><\/b> \u2014 \u0441\u0443\u043f\u0435\u0440\u0433\u0435\u0440\u043e\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043e\u0442 \u0433\u0443\u0433\u043b\u0430, \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u044e\u0449\u0438\u0439 MVVM<\/a> \u0448\u0430\u0431\u043b\u043e\u043d \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/li>\n
- UI-router<\/a><\/b> \u2014 \u0430\u043d\u0433\u0443\u043b\u044f\u0440\u043e\u0432\u0441\u043a\u0438\u0439 \u043c\u043e\u0434\u0443\u043b\u044c, \u0431\u0435\u0437 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u043d\u0435\u043c\u044b\u0441\u043b\u0438\u043c\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439, \u043e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u0445 \u043d\u0430 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u0445<\/a>.<\/li>\n
- Angular-permission<\/a><\/b> \u2014 \u0430\u043d\u0433\u0443\u043b\u044f\u0440\u043e\u0432\u0441\u043a\u0438\u0439 \u043c\u043e\u0434\u0443\u043b\u044c (\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043f\u0430\u0440\u0435 \u0441 ui-router), \u0443\u043f\u0440\u043e\u0449\u0430\u044e\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u0438 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u044e \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u043a\u043b\u0438\u0435\u043d\u0442\u0430.<\/li>\n
- Bootstrap 3<\/a><\/b> \u2014 CSS-\u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a, \u0443\u0441\u043a\u043e\u0440\u044f\u044e\u0449\u0438\u0439 \u0432\u0435\u0440\u0441\u0442\u043a\u0443 \u0430\u0434\u0430\u043f\u0442\u0438\u0432\u043d\u044b\u0445 \u0441\u0442\u0440\u0430\u043d\u0438\u0446.<\/li>\n
- Yeoman<\/a><\/b>-\u0433\u0435\u043d\u0435\u0440\u0430\u0442\u043e\u0440 \u2014 \u043a\u043e\u043d\u0441\u043e\u043b\u044c\u043d\u0430\u044f \u0443\u0442\u0438\u043b\u0438\u0442\u0430 \u0434\u043b\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u044b \u043f\u0440\u043e\u0435\u043a\u0442\u0430.<\/li>\n
- Bower<\/a><\/b> \u2014 \u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440 \u043f\u0430\u043a\u0435\u0442\u043e\u0432, \u0443\u043f\u0440\u043e\u0449\u0430\u044e\u0449\u0438\u0439 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0443 \u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0435\u0439 \u043f\u0440\u043e\u0435\u043a\u0442\u0430.<\/li>\n
- Gulp<\/a><\/b> \u2014 \u043f\u043e\u0442\u043e\u043a\u043e\u0432\u044b\u0439 \u0441\u0431\u043e\u0440\u0449\u0438\u043a \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432 \u043d\u0430 JS.<\/li>\n
- NodeJS<\/a><\/b> \u2014 \u0441\u0440\u0435\u0434\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u0438.<\/li>\n<\/ol>\n
P.S.<\/b>: \u043f\u0443\u043d\u043a\u0442\u044b 5-8 \u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b, \u043d\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0443\u043f\u0440\u043e\u0449\u0430\u044e\u0442 \u0436\u0438\u0437\u043d\u044c \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0433\u043e front-end \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430. <\/div>\n<\/div>\n
\u041f\u0435\u0440\u0432\u044b\u043c \u043d\u0435\u043f\u0440\u0438\u044f\u0442\u043d\u044b\u043c \u0441\u044e\u0440\u043f\u0440\u0438\u0437\u043e\u043c \u0434\u043b\u044f \u043c\u0435\u043d\u044f \u0441\u0442\u0430\u043b\u0430 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u041c\u0438\u0440 web-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043d\u0435 \u0441\u0442\u043e\u0438\u0442 \u043d\u0430 \u043c\u0435\u0441\u0442\u0435, \u043a\u0430\u0436\u0434\u044b\u0439 \u0434\u0435\u043d\u044c \u0432\u044b\u0445\u043e\u0434\u044f\u0442 \u043d\u043e\u0432\u044b\u0435 \u0432\u0435\u0440\u0441\u0438\u0438 \u0432\u044b\u0448\u0435\u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u043d\u044b\u0445 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 \u0438 \u043c\u043e\u0451 \u043c\u0435\u043d\u044e, \u043b\u0435\u043d\u0438\u0432\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043d\u043e\u0435 \u0432 \u0437\u0430\u0432\u0430\u043b\u044f\u0432\u0448\u0435\u043c\u0441\u044f \u043f\u0430\u0440\u0443 \u043c\u0435\u0441\u044f\u0446\u0435\u0432 \u043d\u0430\u0437\u0430\u0434 \u043f\u0440\u043e\u0435\u043a\u0442\u0435, \u043d\u0430\u043f\u0440\u043e\u0447\u044c \u043e\u0442\u043a\u0430\u0437\u044b\u0432\u0430\u043b\u043e\u0441\u044c \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0432 \u043f\u0440\u043e\u0435\u043a\u0442\u0435, \u0441\u043e\u0431\u0440\u0430\u043d\u043d\u043e\u043c \u043d\u0435\u0434\u0430\u0432\u043d\u043e. \u041d\u0438\u0436\u0435 \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u043d \u0441\u043f\u0438\u0441\u043e\u043a \u043f\u0440\u043e\u0431\u043b\u0435\u043c, \u0441 \u043a\u043e\u0442\u043e\u0440\u044b\u043c\u0438 \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f.<\/p>\n
\u041f\u0440\u043e\u0441\u043c\u043e\u0442\u0440 \u043f\u0440\u043e\u0431\u043b\u0435\u043c<\/b><\/p>\n\n- \n
- \u041f\u043e\u0441\u043b\u0435\u0434\u043d\u044f\u044f \u0432\u0435\u0440\u0441\u0438\u044f UI-router \u0432\u044b\u043f\u0430\u0434\u0430\u0435\u0442 \u0441 \u043e\u0448\u0438\u0431\u043a\u043e\u0439, \u0435\u0441\u043b\u0438 \u0432 \u043e\u0431\u044a\u0435\u043a\u0442\u0435 params \u0435\u0441\u0442\u044c \u043f\u043e\u043b\u044f \u0441\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u0438\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u043a \u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u043e\u043c\u0443 \u043e\u0442\u0440\u0438\u0446\u0430\u043d\u0438\u044e (false, 0, undefined, null \u0438\u043b\u0438 \u043f\u0443\u0441\u0442\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0430). \u0420\u0435\u0448\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u044f \u043d\u0435 \u043d\u0430\u0448\u0435\u043b, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043e\u0442\u043a\u0430\u0442\u0438\u043b\u0441\u044f \u0434\u043e \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u043e\u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u00ab0.2.13\u00bb.<\/li>\n
- \u0413\u0435\u043d\u0435\u0440\u0430\u0442\u043e\u0440 Yeoman \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0443\u0434\u043e\u0431\u043d\u0443\u044e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0443 \u0431\u0443\u0434\u0443\u0449\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u0412 \u043a\u043e\u0440\u043d\u0435\u0432\u043e\u043c \u043a\u0430\u0442\u0430\u043b\u043e\u0433\u0435, \u043f\u043e\u043c\u0438\u043c\u043e \u0441\u043b\u0443\u0436\u0435\u0431\u043d\u044b\u0445, \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043a\u0430\u0442\u0430\u043b\u043e\u0433 src \u0441 \u0441\u0430\u043c\u0438\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u043c. \u0412 \u043d\u0435\u043c \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043e\u0441\u043d\u043e\u0432\u043d\u0430\u044f html \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0438 \u0442\u0440\u0438 \u043a\u0430\u0442\u0430\u043b\u043e\u0433\u0430:
![\"\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430](\"https:\/\/pp.vk.me\/c622330\/v622330288\/39f46\/7n1fuo9E4X8.jpg\")
app<\/b> \u2014 \u043a\u0430\u0442\u0430\u043b\u043e\u0433 \u0441 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u043c\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f (\u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f \u043f\u043e\u0434 \u043a\u0430\u0436\u0434\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0432\u044b\u0434\u0435\u043b\u044f\u0442\u044c \u0441\u0432\u043e\u044e \u043f\u0430\u043f\u043a\u0443).
assets<\/b> \u2014 \u043f\u0430\u043f\u043a\u0430 \u0441\u043e \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u043c \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u043e\u043c.
components<\/b> \u2014 \u043f\u0430\u043f\u043a\u0430 \u0434\u043b\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043c\u043d\u043e\u0433\u043e\u043a\u0440\u0430\u0442\u043d\u043e (\u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u044d\u0442\u043e \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b, \u0441\u0435\u0440\u0432\u0438\u0441\u044b, \u0444\u0430\u0431\u0440\u0438\u043a\u0438, \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u044b \u0438 \u0442.\u0434.).
\u0412 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u0442\u0430\u043a\u043e\u0439 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u043e\u0439 Yeoman-\u043e\u0432\u0441\u043a\u0438\u0439 \u0433\u0435\u043d\u0435\u0440\u0430\u0442\u043e\u0440 \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442 gulp \u043d\u0430 \u043c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439 \u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0444\u0430\u0439\u043b\u043e\u0432 \u043a \u0437\u0430\u043f\u0443\u0449\u0435\u043d\u043d\u043e\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044e (\u0432\u0441\u0435 \u0434\u0435\u043b\u0430\u0435\u0442\u0441\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438, \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043a html-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0432\u0440\u0443\u0447\u043d\u0443\u044e).
\u0412 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0435\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u0433\u0435\u043d\u0435\u0440\u0430\u0442\u043e\u0440\u0430 \u043f\u0430\u043f\u043a\u0430 components \u0431\u044b\u043b\u0430 \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0435\u043d\u0430 \u0432 \u043a\u0430\u0442\u0430\u043b\u043e\u0433 app \u0438, \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0431\u044b\u043b\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 gulp. \u0427\u0442\u043e\u0431\u044b \u043d\u0430\u0448 \u043f\u0440\u043e\u0435\u043a\u0442 \u0432\u0438\u0434\u0435\u043b \u043f\u0430\u043f\u043a\u0443 components \u0438 \u043d\u0435 \u0432\u044b\u0434\u0430\u0432\u0430\u043b \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 \u043e\u0448\u0438\u0431\u043a\u0443 \u043e\u0431 \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0438 \u043c\u043e\u0434\u0443\u043b\u044f navbar, \u043f\u0440\u0430\u0432\u0438\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0444\u0430\u0439\u043b\u044b \u0432 \u043f\u0430\u043f\u043a\u0435 gulp:
\n- \n
- \u0441\u043a\u0440\u0438\u043f\u0442 inject.js<\/b>\n
\u0432 \u043c\u0430\u0441\u0441\u0438\u0432 injectScripts<\/i> \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442 <\/p>\n
options.src + '\/components\/**\/*.js' <\/code><\/pre>\n\u0432 \u043c\u0430\u0441\u0441\u0438\u0432 injectStyles<\/b> \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442 <\/p>\n
options.src + '\/components\/**\/*.css' <\/code><\/pre>\n<\/li>\n
- \u0441\u043a\u0440\u0438\u043f\u0442 watch.js<\/b> \u2014 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u0430:\n
gulp.watch(options.src + '\/components\/**\/*.css', function(event) { if(isOnlyChange(event)) { browserSync.reload(event.path); } else { gulp.start('inject'); } }); gulp.watch(options.src + '\/components\/**\/*.js', function(event) { if(isOnlyChange(event)) { gulp.start('scripts'); } else { gulp.start('inject'); } }); gulp.watch(options.src + '\/components\/**\/*.html', function(event) { browserSync.reload(event.path); }); <\/code><\/pre>\n<\/li>\n<\/ul>\n
<\/li>\n
- \u0422\u0430\u043a \u043a\u0430\u043a \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0430 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0430 \u043d\u0430 \u0431\u0443\u0442\u0441\u0442\u0440\u0430\u043f\u0435, \u0442\u043e, \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u043e\u043d\u0430 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0435\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u0432 \u0447\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u0438, \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 jQuery. \u041f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430, Yeoman \u0431\u0443\u0434\u0435\u0442 \u0441\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c \u043f\u0440\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u044c \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f jquery, bootstrap \u0438 \u043a\u0430\u043a \u0441 \u043d\u0438\u043c \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c (\u0430\u043d\u0433\u0443\u043b\u044f\u0440\u043e\u0432\u0441\u043a\u0438\u0435 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b ui-bootstrap \u0438\u043b\u0438 AngularStrap, \u043e\u0444\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u0438\u0435 bootstrap \u0441 jQuery \u043b\u0438\u0431\u043e \u0447\u0438\u0441\u0442\u044b\u0439 CSS). \u0422\u0443\u0442 \u0435\u0441\u0442\u044c \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u043f\u043e\u0434\u0432\u043e\u0445. \u041f\u0440\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435, \u0435\u0449\u0435 \u0434\u043e \u0432\u044b\u0431\u043e\u0440\u0430 \u0432\u044b\u0448\u0435\u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u043d\u044b\u0445 \u043e\u043f\u0446\u0438\u0439, \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0435\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 \u043f\u0440\u043e\u0435\u043a\u0442 jQuery. \u041e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u043d\u0443\u0436\u043d\u043e \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u044d\u0442\u0443 \u043e\u043f\u0446\u0438\u044e, \u0438\u043d\u0430\u0447\u0435 \u043e\u0441\u0442\u0430\u043d\u0435\u043c\u0441\u044f \u0431\u0435\u0437 \u0432\u0430\u0436\u043d\u044b\u0445 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0435\u0439 \u0438 \u0432\u0441\u0435 \u0441\u043b\u043e\u043c\u0430\u0435\u0442\u0441\u044f.
P.S.<\/b>: \u043d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435 \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u043d\u0435 \u0441\u043b\u043e\u0436\u043d\u043e. \u0412\u0441\u0435\u0433\u043e \u043b\u0438\u0448\u044c \u043d\u0443\u0436\u043d\u043e \u043f\u043e\u0434\u0449\u0430\u043c\u0430\u043d\u0438\u0442\u044c \u043a\u043e\u0434 \u0441\u0430\u043c\u043e\u0439 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b \u0438 \u043c\u043e\u0436\u043d\u043e \u0432\u043e\u043e\u0431\u0449\u0435 \u043e\u0431\u043e\u0439\u0442\u0438\u0441\u044c \u0431\u0435\u0437 jQuery, \u043d\u043e, \u043a\u0430\u043a \u0433\u043e\u0432\u043e\u0440\u0438\u0442\u0441\u044f, \u00ab\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u2014 \u043d\u0435 \u0442\u0440\u043e\u0433\u0430\u0439 (\u0441)\u00bb.\n<\/li>\n- \u0415\u0441\u043b\u0438 \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u0435\u0442 \u0436\u0435\u043b\u0430\u043d\u0438\u0435 \u043f\u043e\u0431\u0430\u043b\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0432 \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0433\u0443\u0433\u043b\u043e\u0432\u0441\u043a\u0438\u043c angular-material<\/a>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 Yeoman \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u0432\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0432 \u043f\u0440\u043e\u0435\u043a\u0442, \u043d\u0443\u0436\u043d\u043e \u0437\u043d\u0430\u0442\u044c, \u0447\u0442\u043e \u0432 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0442\u0441\u044f \u0441\u0442\u0430\u0440\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438, \u0434\u043b\u044f \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f \u0441 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0441\u0430\u0439\u0442\u0430 \u043d\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u043c \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e bower \u0441 \u043e\u043f\u0446\u0438\u0435\u0439 —save.<\/li>\n<\/ol>\n
<\/div>\n<\/div>\n
\u0421 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u043c\u0438 \u043c\u043e\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u0437\u0430\u043a\u043e\u043d\u0447\u0438\u043b\u0438, \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043a \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044e \u0441\u0430\u043c\u043e\u0439 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b.
\u0414\u043b\u044f \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430, \u0432\u044b\u043d\u0435\u0441\u0435\u043c html-\u0448\u0430\u0431\u043b\u043e\u043d<\/b> \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u0444\u0430\u0439\u043b.<\/p>\n\u041f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u0448\u0430\u0431\u043b\u043e\u043d<\/b><\/p>\n\n<div class="container" ng-mouseleave="closeMenu($event)"> <div class="navbar-header"> <button type="button" class="navbar-toggle" ng-click="collapseMenu($event)"> <span class="sr-only">Toggle navigation<\/span> <span class="icon-bar"><\/span> <span class="icon-bar"><\/span> <span class="icon-bar"><\/span> <\/button> <a class="link-kukuri" href="#" ui-sref="{{::sref}}" data-letters="{{::name}}">{{::name}}<\/a> <\/div> <div id="navbar" class="collapse navbar-collapse" aria-expanded="false" ng-class="navCollapsed"> <ul class="nav navbar-nav navbar-right"> <li ng-repeat="items in navbar" class="{{::menuClass(items.name, 'firstLevel')}} list-status"> <a href="#" ng-if="!items.name.pop" ui-sref="{{items.state}}" ng-mouseenter="closeOnMoveMenu()">{{items.name}}<\/a> <a href="#" ng-if="items.name.pop" class="dropdown-toggle dropdown-toggle-firstLevel" dropdown-toggle aria-expanded="false" ng-click="expandMenu($event)" ng-mouseenter="expandMenu($event)" ng-mouseleave="closeSubMenu($event)"> {{::items.name[0]}}<b class="caret"><\/b> <\/a> <ul ng-if="items.name.pop" class="dropdown-menu" ng-include="'submenu.template'"><\/ul> <\/li> <\/ul> <\/div> <\/div> <script type="text\/ng-template" id="submenu.template"> <li ng-repeat="items in items.name" ng-if="$index !== 0" class="{{::menuClass(items.name)}} sub-menu"> <a href="#" class="sub-link" ng-if="!items.name.pop" ui-sref="{{::items.state}}" ng-mouseenter="closeOnMoveSubMenu($event)"> {{::items.name}}<\/a> <a href="#" ng-if="items.name.pop" class="dropdown-toggle" data-toggle="dropdown" ng-click="expandSubMenu($event)" ng-mouseenter="expandSubMenu($event)"> {{::items.name[0]}} <\/a> <ul ng-if="items.name.pop" class="dropdown-menu" ng-include="'submenu.template'"> <\/ul> <\/li> <\/script> <\/code><\/pre>\n<\/div>\n<\/div>\n
\u041f\u043e \u0441\u0443\u0442\u0438, \u044d\u0442\u043e \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0433\u043e \u043c\u0435\u043d\u044e \u0438\u0437 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u0431\u0443\u0442\u0441\u0442\u0440\u0430\u043f\u0430 \u0441 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u043c\u0438 \u043d\u044e\u0430\u043d\u0441\u0430\u043c\u0438:<\/p>\n
\u041f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438<\/b><\/p>\n<\/p>\n- \n
- \u0421\u043f\u0438\u0441\u043e\u043a \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b ng-repeat<\/i>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043a\u043b\u043e\u043d\u0438\u0440\u0443\u0435\u0442 \u0437\u0430\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0439 html-\u0448\u0430\u0431\u043b\u043e\u043d, \u043f\u043e\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044f \u0432 \u043d\u0435\u0433\u043e \u0434\u0430\u043d\u043d\u044b\u0435 \u0438\u0437 \u043c\u0430\u0441\u0441\u0438\u0432\u0430 \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0432 \u0442\u0435\u043a\u0443\u0449\u0435\u043c \u0441\u043a\u043e\u0443\u043f\u0435 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b. \u041e\u0442\u043c\u0435\u0447\u0443, \u0447\u0442\u043e \u0432 \u0448\u0430\u0431\u043b\u043e\u043d\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0442\u0430\u043a \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u043c\u043e\u0435 \u043e\u0434\u043d\u043e\u0440\u0430\u0437\u043e\u0432\u043e\u0435 \u043f\u0440\u0438\u0441\u0432\u0430\u0438\u0432\u0430\u043d\u0438\u0435 (one time binding<\/i>), \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u2014 \u0434\u0432\u0435 \u0442\u043e\u0447\u043a\u0438 \u0432\u043e\u0437\u043b\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 {{::name}}<\/i> ). \u0414\u0435\u043b\u043e \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u043d\u0430 \u043a\u0430\u0436\u0434\u0443\u044e \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0443\u044e \u0430\u043d\u0433\u0443\u043b\u044f\u0440 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u044f (watcher), \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u0435\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u0434\u0430\u0439\u0434\u0436\u0435\u0441\u0442\u0435 (\u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043d\u0430 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0432\u0441\u0435\u0445 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0432 \u0442\u0435\u043a\u0443\u0449\u0435\u043c \u0441\u043a\u043e\u0443\u043f\u0435 \u0434\u043e \u0442\u0435\u0445 \u043f\u043e\u0440, \u043f\u043e\u043a\u0430 \u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043c\u0435\u043d\u044f\u044e\u0442\u0441\u044f, \u043f\u043e \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u044e \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0430 DOM \u0441 \u043d\u043e\u0432\u044b\u043c\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438). \u0422\u0430\u043a \u043a\u0430\u043a \u043f\u0443\u043d\u043a\u0442\u044b \u043d\u0430\u0448\u0435\u0433\u043e \u043c\u0435\u043d\u044e \u2014 \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u044b \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u044b\u0435, \u0442\u043e \u0438\u043c\u0435\u0435\u0442 \u0441\u043c\u044b\u0441\u043b \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u0438\u0445 \u043e\u0434\u0438\u043d \u0440\u0430\u0437, \u0441\u043e\u043a\u0440\u0430\u0442\u0438\u0432 \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u0447\u0438\u0441\u043b\u043e \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u0435\u0439 \u0438 \u043f\u043e\u0432\u044b\u0441\u0438\u0432 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c.\n<\/li>\n
- \u0412\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0435 \u043f\u043e\u0434\u043f\u0443\u043d\u043a\u0442\u044b \u0441\u043e\u0431\u0438\u0440\u0430\u044e\u0442\u0441\u044f \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u043e \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 ng-include<\/i>. \u0420\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0448\u0430\u0431\u043b\u043e\u043d\u0430 \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u0432 \u0442\u0435\u0433\u0435 script c \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u043c type=\u00abtext\/ng-template\u00bb<\/i>. \u0411\u0440\u0430\u0443\u0437\u0435\u0440 \u043d\u0435 \u0437\u043d\u0430\u0435\u0442 \u0442\u0430\u043a\u043e\u0439 \u0442\u0438\u043f \u0441\u043a\u0440\u0438\u043f\u0442\u0430 \u0438 \u043d\u0435 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u044d\u0442\u0443 \u0447\u0430\u0441\u0442\u044c DOM, \u043e\u0434\u043d\u0430\u043a\u043e \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0430 ng-include \u0432\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043b\u0438\u0448\u044c \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u0430 \u0432 \u043d\u0443\u0436\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435, \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0443 \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c DOM \u044d\u043b\u0435\u043c\u0435\u043d\u0442.
\u0421\u0430\u043c\u0430 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u043e\u0439 ng-if<\/i>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442, \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043b\u0438 \u0442\u0435\u043a\u0443\u0449\u0438\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u043c\u0430\u0441\u0441\u0438\u0432\u043e\u043c \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u0438\u043b\u0438 \u0441\u0442\u0440\u043e\u043a\u043e\u0439 \u0441 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435\u043c \u043f\u0443\u043d\u043a\u0442\u0430. \u041f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 \u0442\u0430\u043a \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u043c\u043e\u0439 \u00ab\u0443\u0442\u0438\u043d\u043e\u0439 \u0442\u0438\u043f\u0438\u0437\u0430\u0446\u0438\u0438<\/a>\u00bb, \u0435\u0441\u043b\u0438 \u043f\u0435\u0440\u0435\u0434 \u043d\u0430\u043c\u0438 \u043c\u0430\u0441\u0441\u0438\u0432, \u0442\u043e \u043e\u043d \u0438\u043c\u0435\u0435\u0442 \u043c\u0435\u0442\u043e\u0434\u044b \u043c\u0430\u0441\u0441\u0438\u0432\u0430 (push, pop \u0438 \u0442.\u0434.), \u043e\u0431\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u043a \u043a\u043e\u0442\u043e\u0440\u044b\u043c \u0431\u0435\u0437 () \u0432\u0435\u0440\u043d\u0435\u0442 \u043d\u0430\u043c \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u0438\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043a \u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u043e\u043c\u0443 true. \u0415\u0441\u043b\u0438 \u043f\u0435\u0440\u0435\u0434 \u043d\u0430\u043c\u0438 \u0441\u0442\u0440\u043e\u043a\u0430, \u0442\u043e \u0442\u0430\u043a\u043e\u0435 \u043e\u0431\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u043a \u043c\u0435\u0442\u043e\u0434\u0443 \u043c\u0430\u0441\u0441\u0438\u0432\u0430 \u0432\u0435\u0440\u043d\u0435\u0442 undefined.\n<\/li>\n- \u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u043d\u0435\u0433\u043b\u0430\u0441\u043d\u043e\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u043e \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0430\u043c\u0438 \u0430\u043d\u0433\u0443\u043b\u044f\u0440\u0430, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0433\u043b\u0430\u0441\u0438\u0442: \u00ab\u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0430 \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u0430 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b DOM-\u0434\u0435\u0440\u0435\u0432\u0430 \u0432\u043d\u0435 \u0441\u0432\u043e\u0435\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u00bb. \u0414\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0440\u0430\u0441\u043a\u0440\u044b\u0432\u0430\u044e\u0449\u0438\u0445\u0441\u044f \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e \u0442\u0440\u0435\u0431\u0443\u044e\u0442\u0441\u044f \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u0443\u0434\u0443\u0442 \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0442\u044c \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u043a\u043b\u0438\u043a\u0430, \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0438 \u043f\u043e\u043a\u0438\u0434\u0430\u043d\u0438\u044f \u043a\u0443\u0440\u0441\u043e\u0440\u043e\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430. \u041c\u043e\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0431\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043e\u0431\u044b\u0447\u043d\u044b\u0439 \u043f\u043e\u0438\u0441\u043a \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043f\u043e \u0441\u0435\u043b\u0435\u043a\u0442\u043e\u0440\u0430\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 DOM \u0434\u0435\u0440\u0435\u0432\u0430 \u0438 \u043d\u0430\u0432\u0435\u0448\u0430\u0442\u044c \u043d\u0430 \u043d\u0438\u0445 \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u0435\u0439. \u041d\u043e \u0432 \u0431\u043e\u043b\u044c\u0448\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e\u0441\u0442\u044c, \u0447\u0442\u043e \u043a\u0442\u043e-\u0442\u043e \u0434\u0440\u0443\u0433\u043e\u0439 \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0438\u0434\u0435\u043d\u0442\u0438\u0447\u043d\u044b\u0435 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0441\u0435\u043b\u0435\u043a\u0442\u043e\u0440\u043e\u0432. \u041f\u043e\u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u044f \u0442\u0430\u043a\u043e\u0433\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u043d\u0435\u043f\u0440\u0435\u0434\u0441\u043a\u0430\u0437\u0443\u0435\u043c\u044b \ud83d\ude42 \u0414\u043b\u044f \u043f\u043e\u0434\u043e\u0431\u043d\u044b\u0445 \u0441\u043b\u0443\u0447\u0430\u0435\u0432 \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u044b \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b ng-click, ng-mouseenter<\/i> \u0438 ng-mouseleave<\/i>, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u044b\u043b\u0438 \u043d\u0430\u0432\u0435\u0448\u0430\u043d\u044b \u043d\u0430 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b.<\/li>\n<\/ol>\n
<\/div>\n<\/div>\n
\u0414\u0430\u043b\u0435\u0435 \u0432\u043a\u0440\u0430\u0442\u0446\u0435 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c css \u0444\u0430\u0439\u043b<\/b>:<\/p>\n
\u041f\u043e\u043a\u0430\u0437\u0430\u0442\u044c CSS<\/b><\/p>\n@import url(http:\/\/fonts.googleapis.com\/css?family=Gloria+Hallelujah);
.navbar-brand {
font-family: \u00abGloria Hallelujah\u00bb, Verdana, Tahoma;
font-size: 23px;
}
.sub-menu {
background-color: #333;
}
.sub-menu>a {
color: #9d9d9d !important;
padding-left: 10px !important;
}
.dropdown-menu {
padding: 0px;
margin-left: -1px;
margin-right: -1px;
min-width: 90px !important;
}
.dropdown-submenu {
position:relative;
}
.dropdown-submenu>.dropdown-menu {
top:0;
right:100%;
margin-top:6px;
margin-left:-1px;
-webkit-border-radius:0 6px 6px 6px;
-moz-border-radius:0 6px 6px 6px;
border-radius:0 6px 6px 6px;
}
.dropdown-submenu:hover>a:after {
border-left-color:#ffffff;
}
.dropdown-submenu.pull-left {
float:none;
}
.dropdown-submenu.pull-left>.dropdown-menu {
left:-100%;
margin-left:10px;
-webkit-border-radius:6px 0 6px 6px;
-moz-border-radius:6px 0 6px 6px;
border-radius:6px 0 6px 6px;
}
.dropdown-submenu>a:before {
display:block;
content:" ";
float:left;
width: 0;
height: 0;
border-style: solid;
border-color: transparent #cccccc transparent transparent;
margin-top: 7px;
margin-left: -5px;
margin-right: 10px;
}
.dropdown-submenu-big>a:before {
border-width: 4.5px 7.8px 4.5px 0;
}
.dropdown-submenu-small>a:before {
margin-right: 7px;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #cccccc;
}
.dropdown-menu:hover,
.dropdown-toggle:focus,
li>[aria-expanded=\u00abtrue\u00bb],
.navbar-brand:hover,
.sub-menu>a:hover,
.list-status:hover,
.nav .open > a {
color: #fff !important;
background-color: #004444 !important;
}
.menu-active,
.menu-active>a {
font-weight: bold !important;
text-decoration: underline;
}
.navbar-cheat {
width: 100%;
height: 45px;
}
.sub-link:before {
display:block;
content:" ";
float:left;
width: 12px;
height: 5px;
}
\/* Kukuri *\/
.link-kukuri {
font-family: \u00abGloria Hallelujah\u00bb;
outline: none;
text-decoration: none !important;
position: relative;
font-size: 23px;
line-height: 2;
color: #c5c2b8;
display: inline-block;
}
.link-kukuri:hover {
color: #c5c2b8;
}
.link-kukuri:hover::after {
-webkit-transform: translate3d(100%,0,0);
transform: translate3d(100%,0,0);
}
.link-kukuri::before {
content: attr(data-letters);
position: absolute;
z-index: 2;
overflow: hidden;
color: #424242;
white-space: nowrap;
width: 0%;
-webkit-transition: width 0.4s 0.0s;
transition: width 0.4s 0.0s;
}
.link-kukuri:hover::before {
width: 100%;
}
.link-kukuri:focus {
color: #9e9ba4;
} <\/div>\n<\/div>\n\u041d\u0438\u0447\u0435\u0433\u043e \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0433\u043e, \u043a\u043e\u0434 \u0434\u043b\u044f \u043c\u0435\u043d\u044e \u00ab\u043e\u0434\u043e\u043b\u0436\u0438\u043b\u00bb \u0442\u0443\u0442<\/a>, \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u043b\u043e\u0433\u043e \u2014 \u0442\u0443\u0442<\/a>.<\/p>\n
\u0412\u043e\u0442 \u0442\u0430\u043a \u043d\u0435 \u0441\u043f\u0435\u0448\u0430, \u043c\u044b \u0434\u043e\u0431\u0440\u0430\u043b\u0438\u0441\u044c \u0434\u043e \u0441\u0430\u043c\u043e\u0439 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u0438, \u0440\u0430\u0434\u0438 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0438 \u0437\u0430\u0434\u0443\u043c\u044b\u0432\u0430\u043b\u0430\u0441\u044c \u044d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u2014 \u043a\u043e\u0434 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b \u043c\u0435\u043d\u044e \u043d\u0430 \u0430\u043d\u0433\u0443\u043b\u044f\u0440\u0435.<\/p>\n
\u0424\u0430\u0439\u043b navbar.module.js<\/b><\/p>\n
'use strict'; (function () { angular.module('navbar', ['ui.router']); })(); <\/code><\/pre>\n\u041d\u0430\u0447\u043d\u0435\u043c \u0441 \u043a\u0443\u043b\u044c\u0442\u0443\u0440\u044b \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f. \u0421\u0430\u043c \u0430\u043d\u0433\u0443\u043b\u044f\u0440 \u0443\u0441\u0442\u0440\u043e\u0435\u043d \u0442\u0430\u043a, \u0447\u0442\u043e \u043d\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u0412\u0430\u043c \u0441\u0438\u043b\u044c\u043d\u043e \u043d\u0430\u043a\u043e\u0441\u044f\u0447\u0438\u0442\u044c, \u043d\u043e \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u0445\u043e\u0440\u043e\u0448\u0438\u043c \u0442\u043e\u043d\u043e\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u0442\u0440\u043e\u0433\u0438\u0439 \u0440\u0435\u0436\u0438\u043c ‘use strict<\/a>‘ \u0438 \u043e\u0431\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0442\u044c \u043a\u043e\u0434 \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0432 \u0430\u043d\u043e\u043d\u0438\u043c\u043d\u0443\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e.
\u0412\u044b \u0441\u043f\u0440\u043e\u0441\u0438\u0442\u0435, \u043f\u043e\u0447\u0435\u043c\u0443 \u0442\u0430\u043a\u043e\u0435 \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u0430 \u0432\u044b\u043d\u0435\u0441\u0435\u043d\u043e \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u0444\u0430\u0439\u043b? \u0412\u0441\u0435 \u043e\u0447\u0435\u043d\u044c \u043f\u0440\u043e\u0441\u0442\u043e. \u041e\u0434\u043d\u0438\u043c \u0438\u0437 \u043f\u043b\u044e\u0441\u043e\u0432 \u0430\u043d\u0433\u0443\u043b\u044f\u0440\u0430 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0435\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u044c\u043d\u043e\u0441\u0442\u044c, \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043b\u0435\u0433\u043a\u043e \u043f\u0435\u0440\u0435\u043d\u043e\u0441\u0438\u0442\u044c \u043a\u0443\u0441\u043a\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u0430 \u0438\u0437 \u043e\u0434\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0432 \u0434\u0440\u0443\u0433\u043e\u0439. \u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043c\u044b \u043e\u0431\u044a\u044f\u0432\u043b\u044f\u0435\u043c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c ‘navbar<\/i>‘, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432 \u0434\u0430\u043b\u044c\u043d\u0435\u0439\u0448\u0435\u043c \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0432\u0435\u0441\u0438\u0442\u044c \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b, \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u044b, \u0444\u0430\u0431\u0440\u0438\u043a\u0438 \u0438 \u043f\u0440\u043e\u0447\u0438\u0435 \u0440\u0430\u0434\u043e\u0441\u0442\u0438. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u043f\u0440\u0438 \u043f\u0435\u0440\u0435\u043d\u043e\u0441\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u0430 \u0432 \u0434\u0440\u0443\u0433\u043e\u0439 \u043f\u0440\u043e\u0435\u043a\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u043b\u0438\u0448\u044c \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u0441\u0430\u043c \u043c\u043e\u0434\u0443\u043b\u044c ‘navbar<\/i>‘. \u0412\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438, \u043d\u0430\u0432\u0435\u0448\u0430\u043d\u043d\u044b\u0435 \u043d\u0430 \u043d\u0435\u0433\u043e, \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u044e\u0442 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u044f \u0438 \u043f\u043e\u0434\u0442\u044f\u043d\u0443\u0442\u0441\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438.
\u041e\u0442\u0434\u0435\u043b\u044c\u043d\u043e \u043e\u0442\u043c\u0435\u0447\u0443, \u0447\u0442\u043e \u0432\u0442\u043e\u0440\u044b\u043c \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u043e\u043c \u043f\u0440\u0438 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0438 \u043c\u043e\u0434\u0443\u043b\u044f \u0438\u0434\u0435\u0442 \u043c\u0430\u0441\u0441\u0438\u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0435\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0442\u0440\u0435\u0431\u0443\u044e\u0442\u0441\u044f \u0434\u043b\u044f \u0435\u0433\u043e \u0440\u0430\u0431\u043e\u0442\u044b. \u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u044d\u0442\u043e ‘ui-router<\/i>‘. \u0415\u0441\u043b\u0438 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0435\u0439 \u043d\u0435\u0442, \u0442\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u043f\u0443\u0441\u0442\u043e\u0439 \u043c\u0430\u0441\u0441\u0438\u0432, \u0438\u043d\u0430\u0447\u0435 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u044c \u0432 \u0434\u0440\u0443\u0433\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u043d\u0435\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e.
\u0414\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0447\u0430\u0441\u0442\u043e \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u043f\u0440\u043e\u0432\u043e\u0434\u0438\u0442\u044c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0440\u0442\u043e\u0432\u044b\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u044e\u0442\u0441\u044f \u0434\u043e \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432, \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u043e\u0432 \u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u0432. \u0422\u0430\u043a\u0438\u0435 \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u0438 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0432 \u0441\u0435\u043a\u0446\u0438\u0438 config<\/i> (\u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u043e\u0434\u0438\u043d \u0440\u0430\u0437 \u043f\u0440\u0438 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f) \u0438 \u0432 \u0441\u0435\u043a\u0446\u0438\u0438 run<\/i> (\u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u043f\u0440\u0438 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0435 \u043d\u0430 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043e\u043d\u0430 \u043e\u043f\u0438\u0441\u0430\u043d\u0430). \u041e\u0447\u0435\u043d\u044c \u0443\u0434\u043e\u0431\u043d\u043e \u0434\u0435\u0440\u0436\u0430\u0442\u044c \u043a\u043e\u0434 \u044d\u0442\u0438\u0445 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u0432 \u0432\u044b\u0448\u0435\u043e\u043f\u0438\u0441\u0430\u043d\u043d\u043e\u043c \u0444\u0430\u0439\u043b\u0435.<\/p>\n\u0424\u0430\u0439\u043b navbar.directive.js<\/b>:<\/p>\n
\u041f\u043e\u043a\u0430\u0437\u0430\u0442\u044c navbar.directive.js<\/b><\/p>\n\n'use strict'; (function () { angular.module('navbar') .directive('navbar', function ($document, $state, navbarList, navPermission) { return { restrict: 'A', scope: { name: '@', sref: '@' }, templateUrl: '\/components\/navbar.directive\/navbar.template.html', link: function (scope, elem) { var openedMenu = null, openedSubMenu = null, username = navPermission.getUser($state.params); \/\/ \u043f\u0440\u0438\u0441\u0432\u0430\u0438\u0432\u0430\u0435\u043c \u043d\u0430\u0448\u0435\u043c\u0443 DOM \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0443 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u043a\u043b\u0430\u0441\u0441\u044b \u0438 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b bootstrap elem.addClass('navbar navbar-inverse navbar-fixed-top'); elem.attr('role', 'navigation'); \/\/ \u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u0443\u0435\u043c \u0441\u043f\u0438\u0441\u043e\u043a \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e \u0432 \u0441\u043e\u043e\u0442\u0432\u0435\u0441\u0442\u0432\u0438\u0438 \u0441 \u0434\u043e\u0441\u0442\u0443\u043f\u043e\u043c \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0435\u0433\u043e \u0432 scope \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b if(username) { navPermission.acceptPermission(navbarList.list, username); } scope.navbar = navbarList.list; \/\/ \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0435\/\u0441\u043e\u043a\u0440\u044b\u0442\u0438\u0435 \u043c\u0435\u043d\u044e \u043d\u0430 \u0442\u0435\u043b\u0435\u0444\u043e\u043d\u0430\u0445 \u0438\u043b\u0438 \u043f\u0440\u0438 \u0443\u0437\u043a\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 scope.collapseMenu = function ($event) { var navbar = elem.find('#navbar'), expanded = navbar.hasClass('in'); navbar.attr('aria-expanded', !expanded); scope.navCollapsed = (expanded) ? '' : 'in'; closeAllMenu(); stopBubleAndPropagation($event); }; \/\/ \u043f\u0440\u0438\u0441\u0432\u043e\u0435\u043d\u0438\u0435 \u043a\u043b\u0430\u0441\u0441\u0430 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u043f\u0443\u043d\u043a\u0442\u0430 \u043c\u0435\u043d\u044e \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0438 \u043a\u043b\u0430\u0441\u0441\u0430 \u043f\u043e\u0434\u043c\u0435\u043d\u044e, \u0435\u0441\u043b\u0438 \u043f\u0443\u043d\u043a\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043f\u043e\u0434\u043f\u0443\u043d\u043a\u0442\u044b scope.menuClass = function (item, level) { var status = false, activePage = getActivePage($state.current.name), currentPage = (item.pop) ? item[0] : item, classList = (level === 'firstLevel') ? 'dropdown dropdown-firstLevel ' : 'menu-item dropdown dropdown-submenu ', activeClass = (currentPage === activePage || isActive(item, activePage, status) ) ? 'menu-active' : ''; if(item.pop) { return classList + activeClass; } else { return activeClass; } }; \/\/ \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435 \u0438\u043c\u0435\u043d\u0438 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u043f\u0443\u043d\u043a\u0442\u0430 \u043c\u0435\u043d\u044e \u0432 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u043e\u0442\u043a\u0440\u044b\u0442\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439 (\u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c) function getActivePage(state, currentList) { var name; if(!currentList) { currentList = scope.navbar; } for(var i = (currentList[0].name) ? 0 : 1; i < currentList.length; i++) { if(currentList[i].state === state) { return currentList[i].name; } else if(currentList[i].name.pop) { name = getActivePage(state, currentList[i].name); } } return name; } \/\/ \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430, \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043b\u0438 \u043f\u0443\u043d\u043a\u0442 \u043c\u0435\u043d\u044e \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u043c function isActive (item, activePage, status) { if(item.pop) { for(var i = 1; i < item.length; i++) { if(item[i].name.pop) { status = isActive(item[i].name, activePage, status); } else if(item[i].name === activePage) { return true; } } } else if(item === activePage) { return true; } return status; } \/\/ \u0440\u0430\u0441\u043a\u0440\u044b\u0442\u0438\u0435 \u0441\u043e\u043a\u0440\u044b\u0442\u0438\u0435 \u043f\u043e\u0434\u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e \u043f\u043e \u043a\u043b\u0438\u043a\u043a\u0443 \u0438\u043b\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u044e \u043c\u044b\u0448\u0438 (\u0441\u0442\u0440\u0430\u0448\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f, \u0442.\u043a. \u0443\u0447\u0442\u0435\u043d\u044b \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u044b \u0440\u0430\u0437\u043d\u043e\u0433\u043e \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f \u044d\u043a\u0440\u0430\u043d\u0430) scope.expandMenu = function ($event) { var clickedElem = $($event.currentTarget), parentClicked = $($event.currentTarget.parentElement), expanded = clickedElem.attr('aria-expanded'), isOpened = parentClicked.hasClass('open'), attrExpanded = (expanded === 'false'), allOpenedMenu = parentClicked.parent().find('.open'), smallWindow = window.innerWidth < 768, eventMouseEnter = $event.type === 'mouseenter', subMenuAll = elem.find('.dropdown-submenu'); if(!smallWindow || !eventMouseEnter) { allOpenedMenu.removeClass('open'); clickedElem.attr('aria-expanded', attrExpanded); if(isOpened && !eventMouseEnter) { parentClicked.removeClass('open'); } else { parentClicked.addClass('open'); openedMenu = clickedElem; \/\/** } } subMenuAll.removeClass('dropdown-submenu-small dropdown-submenu-big'); if(smallWindow) { subMenuAll.addClass('dropdown-submenu-small'); } else { subMenuAll.addClass('dropdown-submenu-big'); } stopBubleAndPropagation($event); }; \/\/ \u0437\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u043f\u043e\u0434\u043c\u0435\u043d\u044e \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u043d\u0430 \u0441\u043e\u0441\u0435\u0434\u043d\u0438\u0439 \u043f\u0443\u043d\u043a\u0442 \u0432 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u043c \u043c\u0435\u043d\u044e scope.closeOnMoveMenu = function () { var smallWindow = window.innerWidth < 768; if(openedMenu && !smallWindow) { var clickedLink = openedMenu, clickedElement = clickedLink.parent(); clickedElement.removeClass('open'); clickedLink.attr('aria-expanded', false); openedMenu = null; } }; \/\/ \u0440\u0430\u0441\u043a\u0440\u044b\u0442\u0438\u0435 \u0441\u043e\u043a\u0440\u044b\u0442\u0438\u0435 \u043f\u043e\u0434\u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043f\u043e\u0434\u043c\u0435\u043d\u044e (\u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0441 92 \u0441\u0442\u0440\u043e\u043a\u0438) scope.expandSubMenu = function ($event) { var elemClicked = $($event.currentTarget.parentElement), smallWindow = window.innerWidth < 768, eMouseEnter = $event.type === 'mouseenter', sameElement = elemClicked.hasClass('open'); if(!smallWindow || !eMouseEnter) { \/\/ \u043f\u043e\u0442\u043e\u043c \u043f\u043e\u0434\u0443\u043c\u0430\u0442\u044c \u043a\u0430\u043a \u0443\u043f\u0440\u043e\u0441\u0442\u0438\u0442\u044c if(!sameElement && !eMouseEnter || !eMouseEnter || !sameElement) { elemClicked.parent().find('.open').removeClass('open'); } if(!sameElement) { elemClicked.addClass('open'); openedSubMenu = elemClicked; } } stopBubleAndPropagation($event); }; \/\/ \u0437\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u043f\u043e\u0434\u043c\u0435\u043d\u044e \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u043d\u0430 \u0441\u043e\u0441\u0435\u0434\u043d\u0438\u0439 \u043f\u043e\u0434\u043f\u0443\u043d\u043a\u0442 \u0432 \u043f\u043e\u0434\u043c\u0435\u043d\u044e (\u0437\u0432\u0443\u0447\u0438\u0442 \u0442\u043e \u043a\u0430\u043a:)) scope.closeOnMoveSubMenu = function ($event) { var smallWindow = window.innerWidth < 768; if(openedSubMenu && !smallWindow) { var clickedElement = openedSubMenu, savedList = clickedElement.parent(), currentList = $($event.target).parent().parent(); if(savedList[0] === currentList[0]) { clickedElement.removeClass('open'); openedSubMenu = null; } } }; scope.closeMenu = closeMenu; \/\/ \u0443\u0434\u0430\u043b\u044f\u0435\u043c \u0432\u0441\u0435\u0445 \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u0435\u0439 \u0441 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430 \u043f\u0440\u0438 \u0435\u0433\u043e \u0443\u043d\u0438\u0447\u0442\u043e\u0436\u0435\u043d\u0438\u0438 var $body = $document.find('html'); elem.bind('$destroy', function() { $body.unbind(); \/\/\u043d\u0435 \u0445\u0432\u0430\u0442\u0430\u0435\u0442 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u043d\u0430 \u0443\u0434\u0430\u043b\u0435\u043d\u043d\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 }); \/\/ \u043f\u0440\u0438 \u043a\u043b\u0438\u043a\u0435 \u0432\u043d\u0435 \u043c\u0435\u043d\u044e - \u0437\u0430\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0432\u0441\u0435 \u043e\u0442\u043a\u0440\u044b\u0442\u044b\u0435 \u043f\u043e\u0437\u0438\u0446\u0438\u0438 $body.bind('click', closeMenu); function closeMenu ($event) { var elemClicked = $event.relatedTarget || $event.target; if(isClickOutNavbar(elemClicked)) { closeAllMenu(); } } \/\/ \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u043e \u043f\u043e\u0434\u043d\u0438\u043c\u0430\u0435\u043c\u0441\u044f \u043f\u043e \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044f\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430, \u0447\u0442\u043e\u0431\u044b \u0443\u0437\u043d\u0430\u0442\u044c, \u0431\u044b\u043b \u043a\u043b\u0438\u043a \u043f\u043e \u043c\u0435\u043d\u044e \u0438\u043b\u0438 \u043d\u0435\u0442 function isClickOutNavbar(elem) { if($(elem).hasClass('dropdown-firstLevel')) { return false; } if(elem.parentElement !== null) { return isClickOutNavbar(elem.parentElement); } else { return true; } } \/\/ \u0437\u0430\u043a\u0440\u044b\u0432\u0430\u0435\u043c \u0432\u0441\u0435 \u043e\u0442\u043a\u0440\u044b\u0442\u044b\u0435 \u043f\u0443\u043d\u043a\u0442\u044b \u0438 \u043f\u043e\u0434\u043f\u0443\u043d\u043a\u0442\u044b \u043c\u0435\u043d\u044e function closeAllMenu() { elem.find('.open').removeClass('open'); elem.find('[aria-expanded=true]').attr('aria-expanded', false); } \/\/ \u0441\u043b\u0443\u0436\u0435\u0431\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043f\u0440\u0435\u0434\u043e\u0442\u0432\u0440\u0430\u0449\u0435\u043d\u0438\u044f \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u043f\u043e\u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0438 \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0438\u0445 \u0441\u043e\u0431\u044b\u0442\u0438\u0439 function stopBubleAndPropagation($event) { $event.stopPropagation(); $event.preventDefault(); } } }; }); })(); <\/code><\/pre>\n<\/div>\n<\/div>\n
\u0421\u0440\u0430\u0437\u0443 \u043e\u0442\u043c\u0435\u0447\u0443, \u0447\u0442\u043e \u044f \u043d\u0435 \u0433\u043e\u0440\u0436\u0443\u0441\u044c \u043a\u043e\u0434\u043e\u043c, \u043e\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u043c \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0435. \u041e\u043d \u043d\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0431\u043e\u043b\u044c\u0448\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u0430, \u0442.\u043a. \u0442\u0443\u0442 \u0432\u0441\u0435\u0433\u043e \u043b\u0438\u0448\u044c \u043e\u043f\u0438\u0441\u0430\u043d \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u044f\/\u0437\u0430\u043a\u0440\u044b\u0442\u0438\u044f \u043c\u0435\u043d\u044e \u0434\u043b\u044f \u0440\u0430\u0437\u043d\u044b\u0445 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0439 \u044d\u043a\u0440\u0430\u043d\u0430 \u0438 \u043f\u0440\u0438\u0441\u0432\u043e\u0435\u043d\u0438\u0435 \u043d\u0443\u0436\u043d\u044b\u0445 \u043a\u043b\u0430\u0441\u0441\u043e\u0432 \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0432\u0438\u0434\u0430 \u043f\u0443\u043d\u043a\u0442\u0430. \u0411\u043e\u043b\u0435\u0435 \u0438\u043b\u0438 \u043c\u0435\u043d\u0435\u0435 \u043f\u043e\u043b\u0435\u0437\u043d\u0443\u044e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043d\u0435\u0441\u0443\u0442 \u0434\u0432\u0435 \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438: \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043a\u043b\u0438\u043a\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u043c \u0432\u043d\u0435 \u043c\u0435\u043d\u044e (\u0441\u0442\u0440\u043e\u043a\u0430 181) \u0438 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0442\u043e\u0433\u043e, \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043b\u0438 \u043f\u0443\u043d\u043a\u0442 \u043c\u0435\u043d\u044e \u0430\u043a\u0442\u0438\u0432\u043d\u044b\u043c (\u0441\u0442\u0440\u043e\u043a\u0430 70).<\/p>\n
\u041e\u0442\u043c\u0435\u0447\u0443, \u0447\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u043d\u043e \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0441 \u043c\u043e\u0435\u0439 \u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f:<\/u> <\/p>\n
- \n
- \u0414\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0430 \u0438\u043c\u0435\u0435\u0442 \u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0441\u043a\u043e\u0443\u043f, \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u043e\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b name<\/i> \u0438 sref<\/i> \u0447\u0435\u0440\u0435\u0437 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430. \u0422.\u0435. \u0432 \u0431\u043e\u043b\u044c\u0448\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u0448\u0430\u043d\u0441 \u043d\u0430\u0440\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u043d\u0435\u043f\u0440\u0438\u044f\u0442\u043d\u043e\u0441\u0442\u0438.<\/li>\n
- \u0421\u043b\u043e\u0436\u043d\u044b\u0435 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0438 (\u043d\u0430\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430, \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430) \u0432\u044b\u043d\u0435\u0441\u0435\u043d\u044b \u0432 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435. \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0433\u043e\u0432\u043e\u0440\u0438\u0442 \u043e\u0431 \u0438\u0445 \u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0438.
\u0425\u043e\u0440\u043e\u0448\u0438\u043c \u0442\u043e\u043d\u043e\u043c \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u043f\u0440\u0438\u0441\u0432\u043e\u0435\u043d\u0438\u0435 \u0438\u043c\u0435\u043d\u0438 \u0432 \u0432\u0438\u0434\u0435 \u0432\u0435\u0440\u0431\u043b\u044e\u0436\u044c\u0435\u0439 \u043d\u043e\u0442\u0430\u0446\u0438\u0438<\/a>. \u0422\u0430\u043a\u0436\u0435, \u0435\u0441\u043b\u0438 \u0432 \u043a\u043e\u0434\u0435 \u0438\u0434\u0435\u0442 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u0434\u0440\u044f\u0434, \u043d\u0435\u0442 \u0441\u043c\u044b\u0441\u043b\u0430 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e \u043f\u0438\u0441\u0430\u0442\u044c var, \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0438\u0442\u044c \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0447\u0435\u0440\u0435\u0437 \u0437\u0430\u043f\u044f\u0442\u0443\u044e, \u0430 \u0435\u0449\u0435 \u043b\u0443\u0447\u0448\u0435 \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u043a\u0430\u0436\u0434\u0443\u044e \u0438\u0437 \u043d\u0438\u0445 \u0441 \u043d\u043e\u0432\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u0438. \u042d\u0442\u043e \u043f\u043e\u0432\u044b\u0448\u0430\u0435\u0442 \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0441\u0442\u044c \u043a\u043e\u0434\u0430. <\/li>\n<\/ol>\n\u0427\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u043d\u043e \u043d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e:<\/u> <\/p>\n
- \n
- \u041a\u043e\u0434 \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u0441\u043b\u043e\u0436\u043d\u044b\u0439, \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043c\u043e\u0436\u043d\u043e \u0440\u0430\u0437\u0431\u0438\u0442\u044c \u043d\u0430 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0441\u0442\u044b\u0435. \u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u043e: \u043c\u044b\u0441\u043b\u0435\u043d\u043d\u043e \u043f\u0440\u043e\u0438\u0437\u043d\u043e\u0441\u0438\u043c, \u0447\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0438 \u0435\u0441\u043b\u0438 \u0432\u043e \u0444\u0440\u0430\u0437\u0435 \u043f\u0440\u043e\u0441\u043a\u0430\u043a\u0438\u0432\u0430\u0435\u0442 \u0431\u0443\u043a\u0432\u0430 \u00ab\u0418\u00bb, \u0437\u043d\u0430\u0447\u0438\u0442, \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u043d\u0443\u0436\u043d\u043e \u0434\u0435\u043b\u0438\u0442\u044c \u043d\u0430 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0441\u0442\u0443\u044e.<\/li>\n
- \u0421\u043b\u0438\u0448\u043a\u043e\u043c \u0442\u0440\u0438\u0432\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u0438. \u0425\u043e\u0440\u043e\u0448\u0438\u0439 \u043a\u043e\u0434 \u0434\u043e\u043b\u0436\u0435\u043d \u0433\u043e\u0432\u043e\u0440\u0438\u0442\u044c \u0441\u0430\u043c \u0437\u0430 \u0441\u0435\u0431\u044f, \u0447\u0442\u043e \u043e\u043d \u0434\u0435\u043b\u0430\u0435\u0442. \u041a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u0435\u0432 \u0442\u0440\u0435\u0431\u0443\u044e\u0442 \u043b\u0438\u0431\u043e \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u0432 \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0438 \u043c\u043e\u043c\u0435\u043d\u0442\u044b, \u043b\u0438\u0431\u043e \u0442\u0435 \u0443\u0447\u0430\u0441\u0442\u043a\u0438 \u043a\u043e\u0434\u0430, \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0412\u044b \u0432\u044b\u0431\u0440\u0430\u043b\u0438 \u0431\u043e\u043b\u0435\u0435 \u0441\u043b\u043e\u0436\u043d\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u0432\u043c\u0435\u0441\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e, \u0442.\u043a. \u0447\u0442\u043e \u0442\u043e \u0432 \u043f\u0440\u043e\u0441\u0442\u043e\u043c \u0412\u0430\u0441 \u043d\u0435 \u0443\u0441\u0442\u0440\u043e\u0438\u043b\u043e.
\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u0438 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u044b, \u0447\u0442\u043e\u0431\u044b \u0447\u0438\u0442\u0430\u0442\u0435\u043b\u044e \u0431\u044b\u043b\u043e \u043f\u0440\u043e\u0449\u0435 \u0432\u043d\u0438\u043a\u043d\u0443\u0442\u044c \u0432 \u0441\u0443\u0442\u044c \u0432\u043e\u043f\u0440\u043e\u0441\u0430.<\/li>\n<\/ol>\n\u0424\u0430\u0439\u043b navbar.provider.js<\/b><\/p>\n
\u0418\u0442\u0430\u043a, \u043d\u0430\u0448\u0430 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0430 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u0430 \u0438 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442, \u043d\u043e \u043e\u0442\u043a\u0443\u0434\u0430 \u0431\u0440\u0430\u0442\u044c \u0441\u043f\u0438\u0441\u043e\u043a \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e? \u041c\u043e\u0436\u043d\u043e \u043e\u043f\u0438\u0441\u0430\u0442\u044c \u043c\u0430\u0441\u0441\u0438\u0432 \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u0432 \u0441\u0430\u043c\u043e\u0439 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0435, \u043d\u043e \u044d\u0442\u043e \u043d\u0435\u0443\u0434\u043e\u0431\u043d\u043e \u043f\u0440\u0438 \u043f\u043e\u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0438\/\u0443\u0434\u0430\u043b\u0435\u043d\u0438\u0438 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0439 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u043f\u0440\u0438\u0434\u0435\u0442\u0441\u044f \u043b\u0435\u0437\u0442\u044c \u0432 \u043c\u0430\u0441\u0441\u0438\u0432 \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b, \u0438\u0441\u043a\u0430\u0442\u044c \u0432 \u043d\u0435\u043c \u043d\u0443\u0436\u043d\u043e\u0435 \u043c\u0435\u0441\u0442\u043e \u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u043d\u043e\u0432\u044b\u0439. \u0410 \u043f\u0440\u0438 \u0443\u0434\u0430\u043b\u0435\u043d\u0438\u0438 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u0432\u043e\u043e\u0431\u0449\u0435 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0431\u044b\u0442\u044c \u043f\u0440\u043e \u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u043f\u0443\u043d\u043a\u0442\u0430 \u0432 \u043c\u0435\u043d\u044e, \u0447\u0442\u043e \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u0442 \u043a \u043e\u0448\u0438\u0431\u043a\u0430\u043c \u043f\u0440\u0438 \u043f\u043e\u043f\u044b\u0442\u043a\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043f\u043e\u0441\u0435\u0442\u0438\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443.
\u0412\u044b\u0445\u043e\u0434 \u0438\u0437 \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u0438 \u043e\u0447\u0435\u0432\u0438\u0434\u0435\u043d \u2014 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a\u0430\u0436\u0434\u044b\u0439 \u043f\u0443\u043d\u043a\u0442 \u043c\u0435\u043d\u044e \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0432\u043e\u0437\u043b\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0433\u043e \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f. \u0422\u0443\u0442 \u0435\u0441\u0442\u044c \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u043d\u044e\u0430\u043d\u0441. \u041f\u043e\u0440\u044f\u0434\u043e\u043a \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0430\u043d\u0433\u0443\u043b\u044f\u0440\u043e\u0432\u0441\u043a\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439:<\/p>\n- \n
- \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0437\u0430\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0445 \u043c\u043e\u0434\u0443\u043b\u0435\u0439 \u0430\u043d\u0433\u0443\u043b\u044f\u0440\u0430 (module),<\/li>\n
- \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u043e\u0432 (provider),<\/li>\n
- \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0441\u0435\u043a\u0446\u0438\u0438 config (\u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u043e\u0434\u0438\u043d \u0440\u0430\u0437 \u043f\u0440\u0438 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f),<\/li>\n
- \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f factory, service, value, constant,<\/li>\n
- \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0441\u0435\u043a\u0446\u0438\u0438 run (\u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u043f\u0440\u0438 \u0441\u043c\u0435\u043d\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f),<\/li>\n
- \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u043e\u0432 \u0438 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432.<\/li>\n<\/ol>\n
\u0418\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u043e\u0447\u0435\u0440\u0435\u0434\u0438, \u043d\u0430\u043c \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442 \u0441\u0435\u043a\u0446\u0438\u044f config<\/i>, \u0434\u043b\u044f \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0442\u043e\u043b\u044c\u043a\u043e provider<\/i>. \u041a \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u0443 \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0441\u0442\u0443\u0447\u0430\u0442\u044c\u0441\u044f \u0438\u0437 \u043b\u044e\u0431\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0432 \u0435\u0433\u043e \u0438\u043c\u044f \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438. \u041d\u0430 \u044d\u0442\u0430\u043f\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0430 \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u043f\u043e \u0441\u0432\u043e\u0435\u043c\u0443 \u0438\u043c\u0435\u043d\u0438 \u0441 \u0434\u043e\u0431\u0430\u0432\u043a\u043e\u0439 \u00abProvider<\/i>\u00bb, \u0442.\u0435., \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0438\u043c\u044f \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u0430 navbarList<\/i> \u2014 \u0442\u043e \u0432 \u0441\u0435\u043a\u0446\u0438\u0438 \u043a\u043e\u043d\u0444\u0438\u0433 \u043e\u043d \u0431\u0443\u0434\u0435\u0442 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u043f\u043e\u0434 \u0438\u043c\u0435\u043d\u0435\u043c navbarListProvider<\/i>.
\u041a\u043e\u0434 \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d \u043d\u0438\u0436\u0435:<\/p>\n\u041f\u043e\u043a\u0430\u0437\u0430\u0442\u044c navbar.provider.js<\/b><\/p>\n\n'use strict'; (function () { angular.module('navbar') .provider('navbarList', function () { var list = []; \/\/ \u043e\u0441\u043d\u043e\u0432\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0443\u043d\u043a\u0442\u0430 \u0432 \u043c\u0435\u043d\u044e this.add = function (obj) { \/\/ \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043d\u0430 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0437\u0430\u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u0443\u043d\u043a\u0442\u0430 if(obj.location) { if(obj.location.place.length !== obj.location.priority.length || !obj.location.place.pop || !obj.location.priority.pop) { console.log('Warning! Bad location params for menu "' + obj.name + '". Skip item'); return; } } \/\/ \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0443\u043d\u043a\u0442\u0430 \u043d\u0430 \u043f\u0435\u0440\u0432\u044b\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u043c\u0435\u043d\u044e \u043f\u0440\u0438 \u043e\u0442\u0441\u0442\u0443\u0442\u0441\u0442\u0432\u0438\u0438 \u043c\u0435\u0441\u0442\u043e\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f if(!obj.location) { var name = obj.name; for(var i = 0; i < list.length; i++) { \/\/ \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u0430\u0442\u044c \u043f\u0440\u043e \u0442\u0435\u0440\u043d\u0430\u0440\u043d\u044b\u0439 \u043e\u043f\u0435\u0440\u0430\u0442\u043e\u0440 \u0438 \u0443\u0442\u0438\u043d\u0443\u044e \u0442\u0438\u043f\u0438\u0437\u0430\u0446\u0438\u044e var currentName = (list[i].name.pop) ? list[i].name[0] : list[i].name; if(currentName === name) { console.log('Warning! Duplicate menu "' + name + '". Skip item'); return; } } list.push(obj); list.sort(sortByPriority); return; } \/\/ \u043f\u043e\u0438\u0441\u043a \u043f\u0443\u043d\u043a\u0442\u0430, \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0443\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043f\u043e\u0434\u043f\u0443\u043d\u043a\u0442 \u0441\u043e\u0433\u043b\u0430\u0441\u043d\u043e \u043c\u0435\u0441\u0442\u043e\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044e var place = obj.location.place.shift(), priority = obj.location.priority.shift(); for(i = 0; i < list.length; i++) { \/\/ \u043e\u043f\u0438\u0441\u0430\u0442\u044c \u0432 \u0441\u0442\u0430\u0442\u044c\u0435, \u0447\u0442\u043e i \u0431\u043b\u043e\u0447\u043d\u0430\u044f \u043d\u0435 \u0432 JS var currentSubName = (list[i].name.pop) ? list[i].name[0] : null; if(place === currentSubName) { list[i].name = changeExistPart(obj, list[i].name); if(priority !== list[i].priority) { console.log('Warning! Priority of menu "' + list[i].name + '" has been changed from "' + list[i].priority + '" to "' + priority + '"'); list[i].priority = priority; list.sort(sortByPriority); } return; } currentName = list[i].name; if(place === currentName) { console.log('Warning! Duplicate submenu "' + place + '". Skip item'); return; } } \/\/ \u043d\u0438 \u043e\u0434\u043d\u043e \u0432\u044b\u0448\u0435\u043e\u043f\u0438\u0441\u0430\u043d\u043d\u043e\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u0435 \u043d\u0435 \u0441\u043e\u0432\u043f\u0430\u043b\u043e, \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u043d\u043e\u0432\u044b\u0439 \u043f\u0443\u043d\u043a\u0442 \u0441\u043e \u0432\u0441\u0435\u043c\u0438 \u0432\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u043c\u0438 list.push( { name: [place, makeOriginalPart(obj)], priority: priority } ); list.sort(sortByPriority); }; \/\/ \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u044b\u0439 \u043f\u043e\u0438\u0441\u043a \u043c\u0435\u0441\u0442\u0430 \u0432 \u043f\u043e\u0434\u043f\u0443\u043d\u043a\u0442\u0430\u0445 \u043c\u0435\u043d\u044e \u0434\u043b\u044f \u0432\u0441\u0442\u0430\u0432\u043a\u0438 \u043d\u043e\u0432\u043e\u0433\u043e \u043f\u0443\u043d\u043a\u0442\u0430 function changeExistPart(obj, list) { var place = obj.location.place.shift(), priority = obj.location.priority.shift(), \/\/ \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0434\u0432\u043e\u0439\u043d\u043e\u0439 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442 searchName = (place) ? place : obj.name; for(var i = 1; i < list.length; i++) { var currentName = (list[i].name.pop) ? list[i].name[0] : list[i].name; if(searchName === currentName) { if(!list[i].name.pop || (!place && list[i].name.pop) ) { console.log('Warning! Duplicate menu "' + searchName + '". Skip item'); return list; } else { list[i].name = changeExistPart(obj, list[i].name); if(priority !== list[i].priority) { console.log('Warning! Priority of menu "' + list[i].name + '" has been changed from "' + list[i].priority + '" to "' + priority + '"'); list[i].priority = priority; list.sort(sortByPriority); } return list; } } } if(!place) { delete obj.location; list.push(obj); } else { list.push({ name: [place, makeOriginalPart(obj)], priority: priority }); } list.sort(sortByPriority); return list; } \/\/ \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u043e\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043d\u043e\u0432\u043e\u0439, \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b\u044c\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043f\u0443\u043d\u043a\u0442\u0430 \u043c\u0435\u043d\u044e \u0441 \u043f\u043e\u0434\u043f\u0443\u043d\u043a\u0442\u0430\u043c\u0438 function makeOriginalPart (obj) { var place = obj.location.place.shift(), priority = obj.location.priority.shift(); if(place) { var menu = { priority: priority, name: [place, makeOriginalPart(obj)] }; } else { delete obj.location; menu = obj; } return menu; } \/\/ \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0441\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u043a\u0438 \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e \u043f\u043e \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u0443 function sortByPriority(a, b) { return a.priority - b.priority; } \/\/ \u0441\u043b\u0443\u0436\u0435\u0431\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u0430 angularJS this.$get = function () { return { list: list, add: this.add }; }; }); })(); <\/code><\/pre>\n<\/div>\n<\/div>\n
$get<\/i> \u2014 \u0441\u043b\u0443\u0436\u0435\u0431\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u0430\u044f, \u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043c\u0435\u0442\u043e\u0434 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0443\u043d\u043a\u0442\u0430 \u0432 \u043c\u0435\u043d\u044e add<\/i> \u0438 \u0441\u0430\u043c \u0441\u043f\u0438\u0441\u043e\u043a \u043c\u0435\u043d\u044e list<\/i>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u0432 \u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u0438<\/a>.<\/p>\n
\u0424\u0443\u043d\u043a\u0446\u0438\u044f add<\/b> \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043d\u0430 \u0432\u0445\u043e\u0434 \u043e\u0431\u044a\u0435\u043a\u0442 \u0441\u043e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c\u0438 \u043f\u043e\u043b\u044f\u043c\u0438:<\/p>\n
- \n
- priority<\/i> \u2014 \u0447\u0438\u0441\u043b\u0435\u043d\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u0430, \u043f\u043e \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u0441\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0441\u043f\u0438\u0441\u043e\u043a,<\/li>\n
- permission<\/i> \u2014 \u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0439 \u043e\u0434\u043d\u043e \u0438\u0437 \u0434\u0432\u0443\u0445 \u043f\u043e\u043b\u0435\u0439:
\n- \n
- except<\/i> \u2014 \u043c\u0430\u0441\u0441\u0438\u0432 \u0437\u0430\u043f\u0440\u0435\u0449\u0435\u043d\u043d\u044b\u0445 \u0440\u043e\u043b\u0435\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f,<\/li>\n
- only<\/i> \u2014 \u043c\u0430\u0441\u0441\u0438\u0432 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u043d\u044b\u0445 \u0440\u043e\u043b\u0435\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f,<\/li>\n<\/ul>\n<\/li>\n
- location<\/i> \u2014 \u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0439 \u0434\u0432\u0430 \u043f\u043e\u043b\u044f:
\n- \n
- place<\/i> \u2014 \u043c\u0430\u0441\u0441\u0438\u0432 \u0438\u043c\u0435\u043d, \u043f\u043e \u043a\u043e\u0442\u043e\u0440\u044b\u043c \u0441\u0442\u0440\u043e\u0438\u0442\u0441\u044f \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0435 \u043c\u0435\u043d\u044e,<\/li>\n
- priority<\/i> \u2014 \u043c\u0430\u0441\u0441\u0438\u0432 \u0442\u0430\u043a\u043e\u0439 \u0436\u0435 \u0434\u043b\u0438\u043d\u044b, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0439 \u0447\u0438\u0441\u043b\u0435\u043d\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u0430 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u043f\u0443\u043d\u043a\u0442\u0430 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e,<\/li>\n<\/ul>\n<\/li>\n
- name<\/i> \u2014 \u0441\u0442\u0440\u043e\u043a\u043e\u0432\u043e\u0435 \u0438\u043c\u044f \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u0443\u043d\u043a\u0442\u0430.<\/li>\n<\/ol>\n
\u041f\u0440\u0438\u043d\u0446\u0438\u043f \u0440\u0430\u0431\u043e\u0442\u044b \u0444\u0443\u043d\u043a\u0446\u0438\u0438 add<\/i> \u043f\u0440\u043e\u0441\u0442. \u0421\u043f\u0435\u0440\u0432\u0430 \u0438\u0434\u0435\u0442 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u043c\u043e\u0433\u043e \u043d\u0430 \u0432\u0445\u043e\u0434 \u043e\u0431\u044a\u0435\u043a\u0442\u0430, \u0437\u0430\u0442\u0435\u043c \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u043e\u0438\u0441\u043a \u043c\u0435\u0441\u0442\u0430 \u0434\u043b\u044f \u0432\u0441\u0442\u0430\u0432\u043a\u0438 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u0443\u043d\u043a\u0442\u0430. \u0415\u0441\u043b\u0438 \u0441\u043e\u0432\u043f\u0430\u0434\u0435\u043d\u0438\u0439 \u0441 \u043f\u0443\u043d\u043a\u0442\u0430\u043c\u0438 \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d\u043e \u2014 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f makeOriginalPart()<\/i>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043d\u043e\u0432\u043e\u0441\u043e\u0437\u0434\u0430\u043d\u043d\u0443\u044e \u0447\u0430\u0441\u0442\u044c \u043c\u0435\u043d\u044e; \u0435\u0441\u043b\u0438 \u0441\u043e\u0432\u043f\u0430\u0434\u0435\u043d\u0438\u0435 \u043d\u0430\u0439\u0434\u0435\u043d\u043e \u2014 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f changeExistPart()<\/i>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u043e \u0438\u0434\u0435\u0442 \u043d\u0430 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0434\u043e \u0442\u0435\u0445 \u043f\u043e\u0440, \u043f\u043e\u043a\u0430 \u0435\u0441\u0442\u044c \u0441\u043e\u0432\u043f\u0430\u0434\u0435\u043d\u0438\u044f \u0432 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0438 \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u0438\u0437 \u043c\u0430\u0441\u0441\u0438\u0432\u0430 place<\/i>.
\u041f\u043e\u0441\u043b\u0435 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0443\u043d\u043a\u0442\u0430 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u043a\u0430 \u043c\u0435\u043d\u044e \u043f\u043e \u043f\u043e\u043b\u044e priority<\/i>.<\/p>\n\u041f\u0440\u0438 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u0438 \u043a\u043e\u0434\u0430 \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u0430 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u043e \u043d\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438\u0441\u044c \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0438 else if<\/i>. \u0412\u043c\u0435\u0441\u0442\u043e \u044d\u0442\u043e\u0433\u043e \u0432 \u043a\u043e\u043d\u0446\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u044f \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u043b\u0441\u044f return<\/i>. \u042f \u0441\u0447\u0438\u0442\u0430\u044e, \u0434\u0430\u043d\u043d\u044b\u0439 \u0448\u0430\u0433 \u043e\u043f\u0440\u0430\u0432\u0434\u0430\u043d\u043d\u044b\u043c, \u0442.\u043a. \u043e\u043d \u043f\u043e\u0432\u044b\u0448\u0430\u0435\u0442 \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0441\u0442\u044c \u043a\u043e\u0434\u0430. \u0412\u043e\u043e\u0431\u0449\u0435 \u043a\u043e\u0434 \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u0430 \u043d\u0435\u043e\u0434\u043d\u043e\u043a\u0440\u0430\u0442\u043d\u043e \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043b\u0441\u044f. \u041a\u043e\u043c\u0443 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e, \u043d\u0438\u0436\u0435 \u043f\u0440\u0438\u043a\u0440\u0435\u043f\u043b\u044f\u044e \u043f\u0435\u0440\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e.<\/p>\n
\u0421\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043f\u0435\u0440\u0432\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u0430<\/b><\/p>\n\n\u0412\u043d\u0438\u043c\u0430\u043d\u0438\u0435! \u041a\u043e\u0434 \u043d\u0435 \u0434\u043b\u044f \u0441\u043b\u0430\u0431\u043e\u043d\u0435\u0440\u0432\u043d\u044b\u0445.<\/b><\/p>\n\n'use strict'; (function () { angular.module('navbar') .provider('navbarList', function () { var list = []; this.add = addMenu; function addMenu(obj, nestedMenu, currentList) { if(currentList) { list = currentList; } else if(list.length < 1) { list.push(makeOriginalPart(obj)); return; } if(!obj.location || !obj.location.place) { \/\/ \u043f\u0435\u0440\u0435\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443. \u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0442\u044c \u0434\u043b\u0438\u043d\u0443 place==priority isDuplicate(obj.name, list); list.push(obj); list.sort(sortByPriority); return; } else if(obj.location.place.length > 0){ var searchName = obj.location.place.shift(), priority = (obj.location.priority) ? obj.location.priority.shift() : null; for(var i = (nestedMenu) ? 1 : 0; i < list.length; i++) { var currentName = (list[i].name.pop) ? list[i].name[0] :list[i].name; if(currentName === searchName) { if(list[i].name.pop) { \/\/ \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u043f\u0438\u0441\u0430\u0442\u044c \u043f\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0438 \u0441 \u043f\u0435\u0440\u043c\u0438\u0448\u043d if(!nestedMenu) { nestedMenu = [list]; } var sublistName = list[i].name.shift(); list[i].name.sort(sortByPriority); list[i].name.unshift(sublistName); list[i].name.priority = priority; \/\/ \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e \u043f\u0440\u0438\u0441\u0432\u043e\u0435\u043d\u043e \u043c\u0430\u0441\u0441\u0438\u0432\u0443 nestedMenu.push(list[i].name); addMenu(obj, nestedMenu, list[i].name); return; } else { console.log('Warning! Duplicate menu', currentName); } } } if(nestedMenu) { var last = nestedMenu.length - 1; nestedMenu[last].push({ name: [searchName, makeOriginalPart(obj, null, nestedMenu[last]) ], priority: priority }); } } else { last = nestedMenu.length - 1; nestedMenu[last].push(makeOriginalPart(obj, null, nestedMenu[last])); } if(nestedMenu) { \/\/ changeExistPart \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0443\u043d\u0434\u0435\u0444\u0430\u0439\u043d\u0435\u0434 \u043f\u0440\u0438 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0439 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0435 nestedMenu[nestedMenu.length - 1].sort(sortByPriority); list = changeExistPart(nestedMenu); } else { if(priority) { \/\/ \u043f\u0435\u0440\u0435\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443. \u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0442\u044c \u0434\u043b\u0438\u043d\u0443 place==priority obj.location.priority.unshift(priority); } obj.location.place.unshift(searchName); list.push(makeOriginalPart(obj, null, list)); list.sort(sortByPriority); } } function changeExistPart(nestedMenu) { if(nestedMenu.length > 1) { var subList = nestedMenu.pop(), priority = subList.priority, searchName = subList[0], last = nestedMenu.length - 1; for(var i = 1; i < nestedMenu[last].length; i++) { var currentName = (nestedMenu[last][i].name.pop) ? nestedMenu[last][i].name[0] : ''; if(searchName === currentName){ nestedMenu[last][i].name = subList; nestedMenu[last][i].priority = priority; return changeExistPart(nestedMenu); } } return changeExistPart(nestedMenu); \/\/ \u043e\u0448\u0438\u0431\u043a\u0430 \u0432 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0435. \u042d\u0442\u0430 \u0441\u0442\u0440\u043e\u043a\u0430 \u0434\u043e\u043b\u0436\u043d\u0430 \u0431\u044b\u0442\u044c \u043d\u0435 \u043d\u0443\u0436\u043d\u0430 } else { return nestedMenu[0]; } } function makeOriginalPart(obj, menu, currentList){ if(!menu) { isDuplicate(obj.name, currentList); menu = { name: obj.name, priority: obj.priority, state: obj.state, permissions: obj.permissions }; } if(obj.location.place.length > 0) { var currentLocation = obj.location.place.pop(), priority = (obj.location.priority) ? obj.location.priority.pop() : null, currentMenu = { priority: priority, name: [currentLocation, menu] }; return makeOriginalPart(obj, currentMenu); } else { return menu; } } function isDuplicate(name, list) { if(!list || list.length < 1) { return; } for(var i = (list[0].name) ? 0 : 1; i < list.length; i++) { var currentName = (list[i].name.pop) ? list[i].name[0] : list[i].name; if(currentName === name) { console.log('Warning! Duplicate menu', currentName); } } } function sortByPriority(a, b) { return a.priority - b.priority; } this.$get = function () { return { list: list, add: this.add }; }; }); })(); <\/code><\/pre>\n<\/div>\n<\/div>\n
<\/div>\n<\/div>\n
\u0424\u0430\u0439\u043b navbar.permission.js<\/b> <\/p>\n
\u0421\u043c\u043e\u0442\u0440\u0435\u0442\u044c navbar.permission.js<\/b><\/p>\n\n'use strict'; (function () { angular.module('navbar') .factory('navPermission', function (Permission, $q) { \/\/ \u043f\u0435\u0440\u0435\u0431\u0438\u0440\u0430\u0435\u043c \u0432\u0441\u0435 \u0440\u043e\u043b\u0438 \u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u043c \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449\u0443\u044e \u0432 \u0432\u0438\u0434\u0435 \u043f\u0440\u043e\u043c\u0438\u0441\u0430 function getUser(params) { var users = Permission.roleValidations, names = Object.keys(users), promisesArr = []; for(var i = 0; i < names.length; i++) { var current = names[i], validUser = $q.when( users[current](params) ); promisesArr.push(validUser); } return $q.all(promisesArr).then(function (users) { for(var i = 0; i < users.length; i++) { if(users[i]) { return names[i]; } } return null; }); } \/\/ \u0435\u0441\u043b\u0438 \u043f\u0440\u0438\u0448\u0435\u043b \u043f\u0440\u043e\u043c\u0438\u0441, \u0436\u0434\u0435\u043c \u0435\u0433\u043e \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0438 \u043c\u0435\u043d\u044f\u0435\u043c \u043c\u0435\u043d\u044e, \u0435\u0441\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c - \u0441\u0440\u0430\u0437\u0443 \u043c\u0435\u043d\u044f\u0435\u043c \u043c\u0435\u043d\u044e function acceptPermission (list, username) { if(!username.then) { return changeList(list, username); } else { return username.then(function (username) { return changeList(list, username); }); } } \/\/ \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u043e \u043f\u0440\u043e\u0431\u0435\u0433\u0430\u0435\u043c\u0441\u044f \u043f\u043e \u043c\u0430\u0441\u0441\u0438\u0432\u0443 \u043c\u0435\u043d\u044e \u0438 \u0443\u0434\u0430\u043b\u044f\u0435\u043c \u043f\u0443\u043d\u043a\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0437\u0430\u043f\u0440\u0435\u0449\u0435\u043d\u044b \u0434\u043b\u044f \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0440\u043e\u043b\u0438 function changeList(list, username) { for(var i = (list[0].name) ? 0 : 1; i < list.length; i++) { if(list[i].permissions) { if(list[i].permissions.except) { var except = list[i].permissions.except; for(var j = 0; j < except.length; j++) { if(except[j] === username) { list.splice(i--, 1); } } } else if(list[i].permissions.only) { var only = list[i].permissions.only, accessDenided = true; for(j = 0; j < only.length; j++) { if(only[j] === username) { accessDenided = false; } } if(accessDenided) { list.splice(i--, 1); } } } else if(list[i].name.pop) { list[i].name = changeList( list[i].name, username); if(list[i].name.length === 1 ) { list.splice(i--, 1); } } } return list; } \/\/ \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u043c \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0435 \u043c\u0435\u0442\u043e\u0434\u044b \u0444\u0430\u0431\u0440\u0438\u043a\u0438 return { getUser: getUser, acceptPermission: acceptPermission }; }); })(); <\/code><\/pre>\n<\/div>\n<\/div>\n
\u0421\u043a\u0440\u0438\u043f\u0442 \u0444\u0438\u043b\u044c\u0442\u0440\u0430\u0446\u0438\u0438 \u043c\u0435\u043d\u044e \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0443\u0440\u043e\u0432\u043d\u044f \u0434\u043e\u0441\u0442\u0443\u043f\u0430, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0433\u043e \u043c\u043e\u0434\u0443\u043b\u0435\u043c angular-permission. \u041a\u043e\u0434 \u0432\u044b\u043d\u0435\u0441\u0435\u043d \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u0443\u044e \u0444\u0430\u0431\u0440\u0438\u043a\u0443 \u0434\u043b\u044f \u043f\u043e\u0432\u044b\u0448\u0435\u043d\u0438\u044f \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0441\u0442\u0438 \u0438 \u043c\u043e\u0434\u0443\u043b\u044c\u043d\u043e\u0441\u0442\u0438 (\u043d\u0435 \u0432\u0441\u0435\u043c \u043d\u0443\u0436\u0435\u043d \u0434\u0430\u043d\u043d\u044b\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b).
\u0424\u0430\u0431\u0440\u0438\u043a\u0430 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0434\u0432\u0443\u0445 \u043c\u0435\u0442\u043e\u0434\u043e\u0432:<\/p>\n- \n
- acceptPermission<\/i> \u2014 \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u043e \u043f\u0440\u043e\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u043f\u043e \u043c\u0430\u0441\u0441\u0438\u0432\u0443 \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e \u0438 \u0443\u0434\u0430\u043b\u044f\u0435\u043c \u0437\u0430\u043f\u0440\u0435\u0449\u0435\u043d\u043d\u044b\u0435.<\/li>\n
- getUser<\/i> \u2014 \u043c\u0435\u0442\u043e\u0434 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0440\u043e\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u041e\u0447\u0435\u0432\u0438\u0434\u043d\u043e, \u0447\u0442\u043e \u0432 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0440\u043e\u043b\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043c\u043e\u0436\u0435\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0442\u044c\u0441\u044f \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e, \u043d\u043e \u0438 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0440\u043e\u043b\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e \u0441 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435\u043c \u043f\u0440\u043e\u043c\u0438\u0441\u043e\u0432<\/a>.<\/li>\n<\/ol>\n
\u0424\u0430\u0439\u043b navbar.decorator.js<\/b><\/p>\n
\u041f\u043e \u0441\u0443\u0442\u0438, \u0432\u0441\u0435 \u0437\u0430\u0434\u0443\u043c\u0430\u043d\u043d\u043e\u0435 \u043c\u043d\u043e\u0439 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u043e, \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043a\u0430\u043a \u044d\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442. \u041d\u0438\u0436\u0435 \u043f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u0434\u0430 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u044f \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u00ab\u043f\u0435\u0440\u0441\u0438\u0434\u0441\u043a\u0430\u044f \u043a\u043e\u0448\u043a\u0430<\/i>\u00bb \u0441 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0435\u0439 \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u0443\u043d\u043a\u0442\u0430 \u043f\u043e\u0434\u043c\u0435\u043d\u044e \u0432 \u0446\u0435\u043f\u043e\u0447\u043a\u0435 \u043f\u043e\u0434\u0443\u0440\u043e\u0432\u043d\u0435\u0439 \u00ab\u0436\u0438\u0432\u044b\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0430<\/i>\u00bb => \u00ab\u043c\u043b\u0435\u043a\u043e\u043f\u0438\u0442\u0430\u044e\u0449\u0438\u0435<\/i>\u00bb => \u00ab\u043a\u043e\u0448\u043a\u0438<\/i>\u00bb. \u041f\u0443\u043d\u043a\u0442 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0432\u0441\u0435\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f\u043c, \u043a\u0440\u043e\u043c\u0435 \u00abanonymous<\/i>\u00bb \u0438 \u00abbanned<\/i>\u00bb.<\/p>\n
.config(function ($stateProvider, navbarListProvider) { \/\/ \u043e\u0431\u044a\u044f\u0432\u043b\u044f\u0435\u043c \u0442\u0435\u043a\u0443\u0449\u0435\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 $stateProvider .state('persianCat', { url: '\/\u043f\u0435\u0440\u0441\u0438\u0434\u0441\u043a\u0430\u044f \u043a\u043e\u0448\u043a\u0430', templateUrl: 'app\/cats\/persianCat.html', controller: 'persianCatCtrl', \t\tpermissions: { \t\t except: ['anonymous', 'banned'], \t\t redirectTo: 'login' \t\t} }); \/\/ \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u043f\u0443\u043d\u043a\u0442 \u0432 \u043c\u0435\u043d\u044e \tnavbarListProvider.add({ \t\t state: 'persianCat', \t\t name: '\u043f\u0435\u0440\u0441\u0438\u0434\u0441\u043a\u0430\u044f \u043a\u043e\u0448\u043a\u0430', \t\t permissions: { \t\t except: ['anonymous', 'banned'] \t\t }, \t\t priority: 20, \t\t location: { \t\t place: ['\u0436\u0438\u0432\u044b\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0430', '\u043c\u043b\u0435\u043a\u043e\u043f\u0438\u0442\u0430\u044e\u0449\u0438\u0435', '\u043a\u043e\u0448\u043a\u0438'], \t\t priority: [10, 10, 10] \t \t } \t}); }); <\/code><\/pre>\n\u0412\u0440\u043e\u0434\u0435 \u0431\u044b \u0432\u0441\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442, \u043d\u043e, \u0441\u043e\u0433\u043b\u0430\u0441\u0438\u0442\u0435\u0441\u044c \u2014 \u043d\u0435\u043a\u0440\u0430\u0441\u0438\u0432\u043e? \u041f\u043e\u0447\u0442\u0438 \u0432\u0441\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u0430\u044f \u0434\u043b\u044f \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0443\u043d\u043a\u0442\u0430 \u043c\u0435\u043d\u044e \u0434\u0443\u0431\u043b\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043f\u0440\u0438 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0438 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f. \u0427\u0442\u043e\u0431\u044b \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u0438\u0442\u044c \u0432\u0441\u0435 \u0432\u043e\u0435\u0434\u0438\u043d\u043e \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u0441\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0435\u0439 \u0434\u0435\u043a\u043e\u0440\u0430\u0442\u043e\u0440\u043e\u043c<\/i>, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043b\u044e\u0431\u0435\u0437\u043d\u043e \u043d\u0430\u043c \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u0438\u043b\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u043c\u043e\u0434\u0443\u043b\u044f UI-router<\/i>. \u0424\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438, \u0434\u0435\u043a\u043e\u0440\u0430\u0442\u043e\u0440 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u043e\u0431\u0435\u0440\u0442\u043a\u0443 \u0432\u043e\u043a\u0440\u0443\u0433 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0438 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043c\u0435\u043d\u044f\u0442\u044c \u0435\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b. \u041d\u0438\u0436\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d \u043a\u043e\u0434 \u0434\u0435\u043a\u043e\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043d\u0430\u0448\u0435\u0433\u043e \u043c\u0435\u0442\u043e\u0434\u0430 \u00ab.state<\/i>\u00bb, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043f\u043e\u043b\u0435 menu<\/i> \u0438\u0437 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u0432 state \u043e\u0431\u044a\u0435\u043a\u0442\u0430:<\/p>\n
\u0421\u043c\u043e\u0442\u0440\u0435\u0442\u044c navbar.decorator.js<\/b><\/p>\n\n'use strict'; (function() { angular.module('navbar') .config(function ($stateProvider, navbarListProvider) { \/\/ \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0432 \u043c\u0435\u0442\u043e\u0434 state \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e $stateProvider.decorator('state', function (obj) { var menu = obj.menu, permissions = (obj.data) ? obj.data.permissions : null; \/\/ \u0435\u0441\u043b\u0438 \u0432 \u043a\u043e\u0434\u0435 \u043d\u0435 \u0443\u043a\u0430\u0437\u0430\u043d\u0430 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u044f \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u0441\u0442\u0435\u0439\u0442\u0430 \u0432 \u043c\u0435\u043d\u044e - \u043d\u0438\u0447\u0435\u0433\u043e \u043d\u0435 \u0434\u0435\u043b\u0430\u0435\u043c if(!menu) { return; } menu.state = obj.name; \/\/ \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0443\u0435\u043c \u043f\u0440\u0430\u0432\u0430 \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u043f\u0443\u043d\u043a\u0442\u0430 \u043f\u0440\u0438 \u0438\u0445 \u043d\u0430\u043b\u0438\u0447\u0438\u0438 if(permissions) { menu.permissions = {}; if(permissions.except) { menu.permissions.except = permissions.except; } else if(permissions.only) { menu.permissions.only = permissions.only; } else { delete menu.permissions; } } \/\/ \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u0443\u0435\u043c \u043f\u0443\u043d\u043a\u0442 \u043c\u0435\u043d\u044e \u043f\u043e \u0441\u043a\u043e\u043c\u043f\u043e\u043d\u043e\u0432\u0430\u043d\u043d\u043e\u043c\u0443 \u043e\u0431\u044a\u0435\u043a\u0442\u0443 menu navbarListProvider.add(menu); }); }); })(); <\/code><\/pre>\n<\/div>\n<\/div>\n
\u0422\u0435\u043f\u0435\u0440\u044c \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043d\u0430\u0448\u0435\u0433\u043e \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u0441 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0435\u0439 \u0432 \u043c\u0435\u043d\u044e \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0442\u0430\u043a:<\/p>\n
.config(function ($stateProvider) { $stateProvider .state('persianCat', { url: '\/\u043f\u0435\u0440\u0441\u0438\u0434\u0441\u043a\u0430\u044f \u043a\u043e\u0448\u043a\u0430', templateUrl: 'app\/cats\/persianCat.html', controller: 'persianCatCtrl', \t\tpermissions: { \t\t except: ['anonymous', 'banned'], \t\t redirectTo: 'login' \t\t}, \t\tmenu: { \t\t name: '\u043f\u0435\u0440\u0441\u0438\u0434\u0441\u043a\u0430\u044f \u043a\u043e\u0448\u043a\u0430', \t \t priority: 20, \t\t location: { \t\t place: ['\u0436\u0438\u0432\u044b\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0430', '\u043c\u043b\u0435\u043a\u043e\u043f\u0438\u0442\u0430\u044e\u0449\u0438\u0435', '\u043a\u043e\u0448\u043a\u0438'], \t\t \tpriority: [10, 10, 10] \t\t } \t\t} }); \t}); <\/code><\/pre>\n\u0421\u043e\u0433\u043b\u0430\u0441\u0438\u0442\u0435\u0441\u044c \u2014 \u0431\u043e\u043b\u0435\u0435 \u044d\u043b\u0435\u0433\u0430\u043d\u0442\u043d\u043e.<\/p>\n
\u0418 \u043d\u0430\u043f\u043e\u0441\u043b\u0435\u0434\u043e\u043a \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u043b\u0430\u0439\u0444\u0445\u0430\u043a: \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0432 \u0441\u0432\u043e\u0438\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445 \u043f\u043e\u0434 \u043a\u0430\u0436\u0434\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u0443\u044e \u043f\u0430\u043f\u043a\u0443<\/i>, \u043d\u043e \u0438 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u0430\u043d\u0433\u0443\u043b\u044f\u0440\u043e\u0432\u0441\u043a\u0438\u0439 \u043c\u043e\u0434\u0443\u043b\u044c<\/i>, \u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0439\u0442\u0435 \u0435\u0433\u043e \u0432 \u0441\u043f\u0438\u0441\u043e\u043a \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0435\u0439. \u042d\u0442\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0441\u043e\u043a\u0440\u0430\u0442\u0438\u0442 \u0412\u0430\u0448\u0435 \u0432\u0440\u0435\u043c\u044f \u043f\u0440\u0438 \u0443\u0434\u0430\u043b\u0435\u043d\u0438\u0438\/\u043f\u0435\u0440\u0435\u043d\u043e\u0441\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0439 \u0438\u0437 \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u0414\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0443\u0434\u0430\u043b\u0438\u0442\u044c \u043c\u043e\u0434\u0443\u043b\u044c \u0438\u0437 \u0441\u043f\u0438\u0441\u043a\u0430 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0435\u0439 \u0438 \u043f\u0430\u043f\u043a\u0443 \u0441 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c.<\/p>\n
\u0421\u043f\u0430\u0441\u0438\u0431\u043e \u0437\u0430 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435, \u0432\u0441\u0435\u043c \u0443\u0434\u0430\u0447\u0438.<\/i> <\/p>\n
<\/div>\n\u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 http:\/\/habrahabr.ru\/post\/259347\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u043f\u043e\u043b\u043d\u0435 \u043e\u0431\u043e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u043c\u043d\u0435\u043d\u0438\u0435, \u0447\u0442\u043e \u043d\u0430\u0439\u0434\u0435\u043d\u043d\u044b\u0439 \u0432 \u0418\u043d\u0442\u0435\u0440\u043d\u0435\u0442\u0435 \u0447\u0443\u0436\u043e\u0439 \u043a\u043e\u0434 \u043d\u0430\u043c\u043d\u043e\u0433\u043e \u043b\u0443\u0447\u0448\u0435 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0440\u0443\u0447\u043d\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043d\u043e\u0433\u043e, \u0442.\u043a. \u0435\u0433\u043e \u0443\u0436\u0435 \u043e\u0442\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043b\u0438 \u0442\u044b\u0441\u044f\u0447\u0438 \u043b\u0435\u043d\u0438\u0432\u044b\u0445 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432. \u0421\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u043f\u043e\u044d\u0442\u043e\u043c\u0443, \u043a\u043e\u0433\u0434\u0430 \u043f\u0435\u0440\u0435\u0434\u043e \u043c\u043d\u043e\u0439 \u0432\u043e\u0437\u043d\u0438\u043a\u043b\u0430 \u0437\u0430\u0434\u0430\u0447\u0430, \u043e\u043f\u0438\u0441\u0430\u043d\u043d\u0430\u044f \u0432 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0438 \u0441\u0442\u0430\u0442\u044c\u0438, \u044f \u0440\u0435\u0448\u0438\u043b \u043d\u0435 \u0438\u0437\u043e\u0431\u0440\u0435\u0442\u0430\u0442\u044c \u0432\u0435\u043b\u043e\u0441\u0438\u043f\u0435\u0434, \u0430 \u043d\u0430\u0439\u0442\u0438 \u0433\u043e\u0442\u043e\u0432\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435. \u041a \u043c\u043e\u0435\u043c\u0443 \u0443\u0434\u0438\u0432\u043b\u0435\u043d\u0438\u044e, \u043d\u0438 \u043d\u0430 \u0430\u043d\u0433\u043b\u043e\u044f\u0437\u044b\u0447\u043d\u044b\u0445, \u043d\u0438 \u043d\u0430 \u0440\u0443\u0441\u0441\u043a\u043e\u044f\u0437\u044b\u0447\u043d\u044b\u0445 \u0440\u0435\u0441\u0443\u0440\u0441\u0430\u0445 \u043d\u0438\u0447\u0435\u0433\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449\u0435\u0433\u043e \u043f\u043e\u0434 \u043c\u043e\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0430\u043d\u0433\u0443\u043b\u044f\u0440\u0430 \u044f \u043d\u0435 \u043d\u0430\u0448\u0435\u043b. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0431\u044b\u043b\u043e \u043f\u0440\u0438\u043d\u044f\u0442\u043e \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u043a\u043e\u0434 \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e \u0438 \u043f\u043e\u0434\u0435\u043b\u0438\u0442\u044c\u0441\u044f \u0438\u043c \u0441 \u043e\u0431\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0441\u0442\u044c\u044e.<\/p>\n
\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u043c\u0435\u043d\u044e, \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0432 \u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435:<\/u> <\/p>\n
- \n
- \u0412\u0441\u044f \u043d\u0430\u0447\u0438\u043d\u043a\u0430 \u043c\u0435\u043d\u044e \u0441\u043f\u0440\u044f\u0442\u0430\u043d\u0430 \u043f\u043e\u0434 \u043a\u0430\u043f\u043e\u0442\u043e\u043c \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b. \u041f\u0440\u0438 \u0432\u0435\u0440\u0441\u0442\u043a\u0435 html \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043b\u0438\u0448\u044c DOM-\u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0441 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u043e\u0439, \u0447\u0442\u043e \u043f\u043e\u0432\u044b\u0448\u0430\u0435\u0442 \u0447\u0438\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u043a\u043e\u0434\u0430.<\/li>\n
- \u0423 \u043c\u0435\u043d\u044e \u0435\u0441\u0442\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043f\u0443\u043d\u043a\u0442\u044b \u0441 \u0431\u0435\u0441\u043a\u043e\u043d\u0435\u0447\u043d\u044b\u043c \u0443\u0440\u043e\u0432\u043d\u0435\u043c \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0435\u0439.<\/li>\n
- \u041f\u043e\u0434\u0441\u0432\u0435\u0442\u043a\u0430 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0432 \u043c\u0435\u043d\u044e \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430 \u043f\u0435\u0440\u0432\u043e\u043c \u0443\u0440\u043e\u0432\u043d\u0435, \u043d\u043e \u0438 \u043d\u0430 \u043b\u044e\u0431\u043e\u043c \u0443\u0440\u043e\u0432\u043d\u0435 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438.<\/li>\n
- \u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0437\u0430\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u0443\u043d\u043a\u0442 \u043c\u0435\u043d\u044e \u043d\u0430 \u044d\u0442\u0430\u043f\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/li>\n
- \u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f\/\u0441\u043e\u043a\u0440\u044b\u0442\u0438\u044f \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0445 \u043f\u0443\u043d\u043a\u0442\u043e\u0432 \u043c\u0435\u043d\u044e \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043f\u0440\u0430\u0432 \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f.<\/li>\n<\/ol>\n
\u0418\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u0434 \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u044b \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0442\u0443\u0442<\/a><\/b>. <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-258492","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/258492","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=258492"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/258492\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=258492"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=258492"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=258492"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
- getUser<\/i> \u2014 \u043c\u0435\u0442\u043e\u0434 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0440\u043e\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u041e\u0447\u0435\u0432\u0438\u0434\u043d\u043e, \u0447\u0442\u043e \u0432 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u0440\u043e\u043b\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043c\u043e\u0436\u0435\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0442\u044c\u0441\u044f \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e, \u043d\u043e \u0438 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0440\u043e\u043b\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e \u0441 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435\u043c \u043f\u0440\u043e\u043c\u0438\u0441\u043e\u0432<\/a>.<\/li>\n<\/ol>\n
- priority<\/i> \u2014 \u043c\u0430\u0441\u0441\u0438\u0432 \u0442\u0430\u043a\u043e\u0439 \u0436\u0435 \u0434\u043b\u0438\u043d\u044b, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0439 \u0447\u0438\u0441\u043b\u0435\u043d\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u0430 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u043f\u0443\u043d\u043a\u0442\u0430 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e,<\/li>\n<\/ul>\n<\/li>\n
- only<\/i> \u2014 \u043c\u0430\u0441\u0441\u0438\u0432 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u043d\u044b\u0445 \u0440\u043e\u043b\u0435\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f,<\/li>\n<\/ul>\n<\/li>\n
- permission<\/i> \u2014 \u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0439 \u043e\u0434\u043d\u043e \u0438\u0437 \u0434\u0432\u0443\u0445 \u043f\u043e\u043b\u0435\u0439:
- priority<\/i> \u2014 \u0447\u0438\u0441\u043b\u0435\u043d\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u0430, \u043f\u043e \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u0441\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0441\u043f\u0438\u0441\u043e\u043a,<\/li>\n
- \u0421\u043b\u043e\u0436\u043d\u044b\u0435 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0438 (\u043d\u0430\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430, \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430) \u0432\u044b\u043d\u0435\u0441\u0435\u043d\u044b \u0432 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435. \u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0433\u043e\u0432\u043e\u0440\u0438\u0442 \u043e\u0431 \u0438\u0445 \u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0438.
- \u0412\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0435 \u043f\u043e\u0434\u043f\u0443\u043d\u043a\u0442\u044b \u0441\u043e\u0431\u0438\u0440\u0430\u044e\u0442\u0441\u044f \u0440\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u043e \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 ng-include<\/i>. \u0420\u0435\u043a\u0443\u0440\u0441\u0438\u0432\u043d\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0448\u0430\u0431\u043b\u043e\u043d\u0430 \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u0432 \u0442\u0435\u0433\u0435 script c \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u043c type=\u00abtext\/ng-template\u00bb<\/i>. \u0411\u0440\u0430\u0443\u0437\u0435\u0440 \u043d\u0435 \u0437\u043d\u0430\u0435\u0442 \u0442\u0430\u043a\u043e\u0439 \u0442\u0438\u043f \u0441\u043a\u0440\u0438\u043f\u0442\u0430 \u0438 \u043d\u0435 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u044d\u0442\u0443 \u0447\u0430\u0441\u0442\u044c DOM, \u043e\u0434\u043d\u0430\u043a\u043e \u0434\u0438\u0440\u0435\u043a\u0442\u0438\u0432\u0430 ng-include \u0432\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043b\u0438\u0448\u044c \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u0430 \u0432 \u043d\u0443\u0436\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435, \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0443 \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c DOM \u044d\u043b\u0435\u043c\u0435\u043d\u0442.
- \u0441\u043a\u0440\u0438\u043f\u0442 watch.js<\/b> \u2014 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u0430:\n
- \u0441\u043a\u0440\u0438\u043f\u0442 inject.js<\/b>\n
- UI-router<\/a><\/b> \u2014 \u0430\u043d\u0433\u0443\u043b\u044f\u0440\u043e\u0432\u0441\u043a\u0438\u0439 \u043c\u043e\u0434\u0443\u043b\u044c, \u0431\u0435\u0437 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u043d\u0435\u043c\u044b\u0441\u043b\u0438\u043c\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439, \u043e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u0445 \u043d\u0430 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u0445<\/a>.<\/li>\n
- AngularJS<\/a><\/b> \u2014 \u0441\u0443\u043f\u0435\u0440\u0433\u0435\u0440\u043e\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043e\u0442 \u0433\u0443\u0433\u043b\u0430, \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u044e\u0449\u0438\u0439 MVVM<\/a> \u0448\u0430\u0431\u043b\u043e\u043d \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/li>\n