Wie ein sideNav in Angular-Material Design Pin offen

Question

I ben haben mit

<md-sidenav md-component-id="leftNav" md-is-open="vm.isOpen" 
      md-is-locked-open="vm.isPinned" ... > 
    <i class="fa fa-bars float-right" ng-click="vm.toggleNav()"></i> 
    ... 
</md-sidenav> 

mit dem toggleNave Verfahren in der Steuerung den Wert

class MyController { 
    constructor($mdSideNav) { 
     this.mdSideNav = mdSideNav; 
     this.isPinned = false; 
     this.isOpen = false; 
    } 

    toggleNav = (navId) => { 
     this.$mdSideNav(navId).toggle().then(() => { 
      this.isPinned = this.isOpen; 
     } 
    } 
} 

Einstellung Aber dies bewirkt, dass der Bildschirm auf blinken Öffnen und Schließen, und es scheint nicht der beste Weg zu sein, eine SideNav zu öffnen.

Der Wunsch ist es, die Nave-Taste offen/geschlossen zu haben, aber klebrig offen zu bleiben, bis ich sie schließe.

Wenn ich md-is-locked = "$ media ('')" verwende, dann wird die SideNav gesperrt und schließt nie, bis das Fenster unter Mediengröße schrumpft. Das ist nicht was ich will.

Wenn ich md-is-locked überhaupt nicht benutze, dann klappt der SideNav zu, wenn man wegklickt, aber ich möchte, dass er offen bleibt! bis ich es schließen will.

Wer weiß, wie man das macht?

Dank

BTW: Ich bin mit ES6, damit die Klasse Pfeil und Funktionen. :-)

Answer 1

Aus der Betrachtung der Dokumentation, ich glaube nicht, dass Sie die Variablen IsPinned und IsOpen verwenden müssen, wie es aussieht, wie die Toggle-Funktion behandelt.

Daher ist diese

toggleNav = (navId) => { 
    this.$mdSideNav(navId).toggle().then(() => { 
     this.isPinned = this.isOpen; 
    } 
} 

kommen würde,

toggleNav = (navId) => { 
    this.$mdSideNav(navId).toggle(); 
} 

Um diese Arbeit zu machen Sie durch die ID des sideNav

Also das

<i class="fa fa-bars float-right" ng-click="vm.toggleNav()"></i> 

passieren müssen

würde werden

<i class="fa fa-bars float-right" ng-click="vm.toggleNav('leftNav')"></i> 

Schließlich lohnt sich die Version von Material Design Überprüfung Sie verwenden, scheint es durchaus ein paar Probleme zu sein, wenn nicht die> 0,8 Version.

Siehe Beispiel für die richtige nav in dem Side Nav Material Design