Merge pull request #119 from Orange-OpenSource/bugfixes/navbar

o-nav-menu correction & its exemple in the doc
Orange-OpenSource · Oct 16, 2019 · debd517 · debd517
2 parents 4adcd65 + 4bd4d4d
commit debd517
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 2 deletions.
diff --git a/projects/ng-boosted/src/lib/o-nav-menu/o-nav-menu.component.html b/projects/ng-boosted/src/lib/o-nav-menu/o-nav-menu.component.html
@@ -1,3 +1,3 @@
-<button class="nav-link" ngbDropdownToggle [attr.title]="title === 'undefined' ? null : title" [attr.aria-label]="title === 'undefined' ? null : title"
+<button class="nav-link" ngbDropdownToggle [attr.title]="title === 'undefined' ? null : title" [attr.id]="idForLabelledby === 'undefined' ? null : idForLabelledby" [attr.aria-label]="title === 'undefined' ? null : title"
       (click)="$event.stopPropagation();">{{menuTitle}}</button>
  <ng-content></ng-content>
diff --git a/projects/ng-boosted/src/lib/o-nav-menu/o-nav-menu.component.ts b/projects/ng-boosted/src/lib/o-nav-menu/o-nav-menu.component.ts
@@ -9,7 +9,7 @@
 import { Component, Input, HostBinding } from '@angular/core';
 
 @Component({
-    selector: 'lib-li[o-nav-menu]',
+    selector: 'li[o-nav-menu]',
     styles: [`
       button {
         border: 0;
@@ -30,4 +30,7 @@ import { Component, Input, HostBinding } from '@angular/core';
 
     @Input()
     public title: string;
+
+    @Input()
+    public idForLabelledby: string;
   }
diff --git a/src/app/demos/o-navbar.component.html b/src/app/demos/o-navbar.component.html
@@ -12,6 +12,13 @@
             <li><a class="dropdown-item" href="#">About Markdown</a></li>
         </ul>
     </li>
+    <li ngbDropdown o-nav-menu idForLabelledby="dropdownMenu1" menuTitle="Toggle dropdown">
+        <div ngbDropdownMenu aria-labelledby="dropdownMenu1">
+            <button ngbDropdownItem>Action - 1</button>
+            <button ngbDropdownItem>Another Action</button>
+            <button ngbDropdownItem>Something else is here</button>
+        </div>
+    </li>
 
     <li class="nav-item"><a href="http://orange.com" class="nav-link">External link</a></li>
 </lib-o-navbar>