각도 재료 2 navbar to hamburger menu

https://material.angular.io을 사용하려고합니다. Adter Bootstrap 3 나는 simle navbars를 사용했는데 모든 것을 만들었고 뒤에 로직을 구현할 필요가 없었다. 예를 들어 화면이 모든 메뉴 요소를 보여주기에 너무 적 으면 햄버거 메뉴로 이동한다.각도 재료 2 navbar to hamburger menu

이 navbars처럼 뭔가 보이는 내가 필요

<md-toolbar color="primary"> 
    <nav md-tab-nav-bar> 
     <a md-tab-link> 
      This 
     </a> 
     <a md-tab-link> 
      Looks 
     </a> 
     <a md-tab-link> 
      really bad 
     </a> 
     </nav> 
    </md-toolbar>

나는, 이런 식으로 뭔가를 만들기 위해 내 현재 최고의 코드를 시도하고 내가 정말 여기까지에서 해요 알고 https://mdbootstrap.com/components/navbar/

을하지만, 여전히 그것을 구현하려고 애를 썼다 ..

불행히도 mdbootstrap을 사용할 수 없습니다. 왜냐하면 거의 모든 좋은 일을 위해서는 부트 스트랩 4가 필요하기 때문에 전체 프로젝트에서 부트 스트랩 3을 사용하고 있기 때문에 업그레이드가 정말 고통 스러울 것입니다.

도움 및 의견을 보내 주셔서 감사합니다.

출처

2017-09-07 Colosh

에뮬레이트하려는 navbar의 스크린 샷을 표시 할 수 있습니까? 이 페이지에는 몇 가지가 있습니다. –

안녕하세요. md-tab-nav-bar 중에서 가장 좋은 해결책은 md-tab-nav-bar입니다. 예는 다음과 같습니다.

출처

2017-09-08 16:16:11 Nodarii

안녕하세요, 불행히도 여전히 정말 안좋아 보이고 화면이 작을 때 햄버거 메뉴로 전화를 걸지 않습니다. nav toggle과 callopse가 있어야한다는 것을 알고 있습니다. 다른 것들은 있지만 불행히도이 구조체 안에서는 작동하지 않습니다. – Colosh

햄버거 메뉴로 축소하면 몇 가지 추가 스크립팅이 필요합니다. 재료 디자인에 대한 예외이기 때문에 "즉시 사용할 수있는"작동 솔루션이 없습니다. – Nodarii

머티리얼 디자인의 가장 일반적인 시나리오는 툴바에 사전 정의 된 "햄버거"아이콘이 있고 아이콘을 클릭하여 열리는 항목을 사이드 바에 연결하는 것입니다. 다음은 [spec] (https://material.io/guidelines/patterns/navigation-drawer.html#navigation-drawer-behavior)입니다. – Nodarii

각도 재료 2 navbar to hamburger menu

답변

관련 문제