2017-04-16 28 views
0

Ich versuche, ein Seitennav zu machen. Ich habe ein Tutorial online gesehen und es verfolgt. Es scheint, dass alles, was ich getan habe, richtig ist, aber es funktioniert nicht.eckiges Material sideNav funktioniert nicht

Ich werde wirklich schätzen, wenn Sie mir helfen. Vielen Dank im Voraus

die Codes

angular.module('myApp') 
.controller('MainCtrl', function ($scope, $timeout, $mdSidenav) { 

    $scope.openSideNavPanel = function() { 
     $mdSidenav('left').open(); 
    }; 
    $scope.closeSideNavPanel = function() { 
     $mdSidenav('left').close(); 
    }; 

});

Html:

<md-toolbar> 
    <md-button class="md-icon-button" aria-label="Side Panel" ng-click="openSideNavPanel()"> 
     <md-tooltip>Side Panel</md-tooltip> 
     <md-icon class="md-default-theme" class="material-icons">&#xE5D2;</md-icon> 
    </md-button> 
</md-toolbar> 

<md-sidenav class="md-sidenav-left md-whiteframe-z2" md-component-id="left"> 
    <md-toolbar layout="row"> 
    <div class="md-toolbar-tools"> 
     <h2> 
      <span>Side Panel</span> 
     </h2> 
     <span flex></span> 
     <md-button class="md-icon-button" aria-label="Close Side Panel" ng-click="closeSideNavPanel()"> 
      <md-tooltip>Close Side Panel</md-tooltip> 
      <md-icon class="md-default-theme" class="material-icons">&#xE5CD;</md-icon> 
     </md-button> 
     </div> 
    </md-toolbar> 
    <md-content layout-padding=""> 
     Side navigation Panel 
    </md-content> 
</md-sidenav> 

<md-content flex layout-padding> 



    <div class="container"> 
    <div ng-view=""></div> 
    </div> 


    </div> 

</md-content> 

weitere Informationen: I Yeoman Winkelgenerator

Antwort

0

die Antwort gefunden verwende. Alles oben ist richtig Nur ein extra Controller soll geschrieben werden.

Da ich bin mit Angular Yeoman Generator, und ich war der Code für den Controller MainCtrl schreiben, wo MainCtrl für den View verantwortlich ist Main.html nicht nur die INDEX.HTML

Schrieb Deshalb einen neuen Controller nur für den Index und legen den über Code unter einem div, wie diese

<div ng-controller="indexController"> 
     all abouve html code 
    </div> 

und es funktionierte