在Angular中滑动多级菜单和面包屑

Question

Does anyone know how I could modify the following code to make a sliding multi-level menu and breadcrumbs in Angular, like this facebook help page?

My basic html code is like this:

<ul>
<li>
    <a href="#">Electronics</a>
    <ul>
        <li><a href="#">back</a></li>
        <li><a href="#">Phones</a></li>
    </ul>
</li>
<li>
    <a href="#">Furniture</a>
    <ul>
        <li><a href="#">back</a></li>
        <li>
            <a href="#">Living Room</a>
            <ul>
                <li><a href="#">back</a></li>
                <li><a href="#">Bookshelves</a></li>
            </ul>
        </li>
        <li><a href="#">Patio</a></li>
    </ul>
</li>
</ul>

Answer 1

In regards to the sliding menu, there are a ton of solutions out there. Here are some links:

http://www.sitepoint.com/pure-css-off-screen-navigation-menu/ http://blogs.sitepointstatic.com/examples/tech/css3-sliding-menu/index.html

To stay in the angular world you can switch out partials in different states or use something like ng-switch. There are really so many options it is difficult to give you a single answer.

In regards to the breadcrumbs, here are a few nice pre-built options:

jsc-breadcrumbs - a blog post with instructions angular-breadcrumbs