なぜ私はsidenavを含めることができないのですか？

Question

MaterializeCSSを使用してsidenavを作成しました。私は角度を使ってコントローラを作成しました。しかし、別のhtmlにsidenavを含めると、うまくいきません。私はトリガーボタンしか見ることができませんが、クリックすると何も起きず、コンソールにエラーもありません。ここで

はsidenavです：

<div> 

<ul id="slide-out" class="side-nav"> 
    <li><div class="userView" ng-controller = "accountCtrl"> 
    <img class="background" src="img/wood.jpg"> 
    <a href="#!user"><img class="circle" src="img/profile-picture.jpg"></a> 
    <a href="#!name"><span class="white-text name">{{user.firstName}} {{user.lastName}}</span></a> 
    <a href="#!email"><span class="white-text email">{{user.email}}</span></a> 
    </div></li> 

    <li><a><i class="material-icons">today</i>Today</a></li> 
    <li><a><i class="material-icons">perm_identity</i>Account</a></li> 
    <li><a><i class="material-icons">assignment</i>Projects</a></li> 
    <li><a><i class="material-icons">perm_media</i>Gallery</a></li> 

    <li><a class="subheader"></a></li> 
    <li><a class="subheader"></a></li> 

    <li><div class="divider"></div></li> 
    <li><a><i class="material-icons">settings</i>Account Settings</a></li> 
</ul> 

<!-- This is the button I can see when the file is included --> 

<div class="fixed-action-btn" style="bottom: 45px; right: 24px;"> 
    <a class="btn-floating btn-large waves-effect waves-light red button-collapse" 
    data-activates="slide-out"><i class="material-icons">label_outline</i></a> 
</div> 

</div> 

そして、これは別のHTMLファイルにNG-などがあります。

<div ng-include = "'partials/dashboard.html'" ng-controller = "dashboardCtrl"></div> 

投稿を編集してコントローラを表示できますが、実際には何もしていないので、私はとても重要ではないと思います。私はsidenavを初期化しています。

Answer 1

になります。 ng-includeディレクティブは、プロトタイプ的に囲むスコープから継承する新しいスコープを作成します。 ng-controllerディレクティブは、コントローラを新しいスコープの親にインスタンス化します。

AngularJSに新しいスコープを作成せずにhtmlを作成させるには、ディレクティブを使用します。

app.directive("dashboardComponent", function() { 
    return { 
     templateUrl: 'partials/dashboard.html', 
     controller: "dashboardCtrl" 
    }; 
}); 

使用方法：詳細については

<dashboard-component></dashboard-component> 

、問題はその後で何AngularJS Wiki -- Understanding Scopes -- ng-include

Answer 2

href = "＃"を追加すると違いがありますか？

<a class="btn-floating btn-large waves-effect waves-light red button-collapse" 
    data-activates="slide-out"><i class="material-icons">label_outline</i></a> 

問題はスコープの問題である

<a href="#" class="btn-floating btn-large waves-effect waves-light red button-collapse" 
    data-activates="slide-out"><i class="material-icons">label_outline</i></a>