Question

我试图用控制器隐藏一些菜单。这是我的元素容器，其中将加载菜单。

<div class="page-content" ng-controller = "menuController">
    <div id="Menu"  > </div>
    <div ng-view> </div>            
</div>

<script> 

    $(function(){
      $("#Menu").load("Menu.html");
    });

    app.controller("menuController", function($scope) {
        $scope.showMenu = false;    
    });

</script>

我在单独的html文件中编写了菜单。

<div class="category-content no-padding"> 

        <ul ng-show= "showMenu">
            <li><a href="#org"><i class="fa fa-h-square text-brown" aria-hidden="true"></i><span>Organization</span></a>
            </li>
            <li><a href="#Main"><i class="fa fa-hospital-o text-brown" aria-hidden="true"></i><span>Clinic</span></a>
            </li>
            <li><a href="#User"><i class="fa fa-user text-brown" aria-hidden="true"></i><span >User</span></a>
            </li>
        </ul>
</div>

但对我来说，控制器中声明的范围变量对菜单没有任何影响。请帮助我克服这一点。

感谢您宝贵的时间。

Answer 1

将Jquery代码与Angular代码混合使用并不是很好。您可以使用angular＆quot; ng-include指令加载菜单：

<div class="page-content" ng-controller = "menuController">
    <div ng-include="'Menu.html'"  > </div>
    <div ng-view> </div>            
</div>

根据Menu.html的位置，您可能需要精确调整整个路径，例如：

<div> ng-include="'folder/subfolder/Menu.html'" </div>

控制器范围不在单独的html页面中工作

1 个答案: