angular/components

docs(menu): add example of nested menus using dynamic data

Open

#7434 opened on Sep 30, 2017

View on GitHub
 (33 comments) (7 reactions) (0 assignees)TypeScript (24,044 stars) (6,650 forks)batch import
P4area: material/menudocsfeaturehelp wanted

Description

Bug, feature request, or proposal:

Feature Request - Menu Docs

What is the expected behavior?

The docs would include an example of building a menu from a data structure similar to the radio button docs.

What is the current behavior?

The menu docs only include a nested menu example using static HTML.

What are the steps to reproduce?

Working on a Stackblitz demo atm...

What is the use-case or motivation for changing an existing behavior?

This is a common use case for building application menus, especially for business applications. The data may come from a config file, a REST API, or some other source but it is very often not static and does not align with a static HTML example.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 4.4.3 TypeScript 2.3.4 Chrome 61 OS X El Capitan

Is there anything else we should know?

Thank you for your hard work on this library!

Contributor guide

Tech stack
typescripthtmlcss
Domain
documentationfrontend
Issue type
documentation
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Angular basicsAngular Material menu component
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
60
Research direction
Review the existing menu documentation and radio button docs for pattern. Check the issue comments for any proposed solutions or discussions. The example should create a nested menu from a data structure, dynamically generating menu items using *ngFor and MatMenu. Look at the component source in material/menu/ for any dynamic usage patterns. Consider providing a Stackblitz demo similar to the radio examples.