javascript - AngularJS - JQuery：ngInclude 指令 - DOM

Question

我的模板引导程序包含 JS，因为它们被称为 JS 未执行，请您有一个想法。

这是我的 Index.html

<body ng-app>
    <ng-include src="'sidebar.html'"></ng-include>
    <ng-include src="'navbar.html'"></ng-include>
</body>

我的 navbar.html

<header class="navbar navbar-inverse" role="banner">
            <button type="button" id="menu-toggler">
                ...
            </button>

在我的模板库中有-theme.js

$("#menu-toggler").click(function (e) {
    $("body").toggleClass("menu");
    e.stopPropagation();
  });

当 Body 元素中有“菜单”类时，CSS 会显示一个侧边栏

谁知道为什么不显示？？（演示jsfiddle）

score 1 · Accepted Answer

不要像使用 jQuery 那样使用 Angular；添加ng-class到<body>，添加ng-click到您的按钮并处理来自 Angular 的事件：

<body ng-class="{'menu': bodyIsMenu} ng-controller="Ctrl">
    ...
    <button ng-click="toggle()">...</button>
    ...
</body>

注意我把控制器放在了body中，以便fortoggle()和bodyIsMenuto在同一个范围内。JS：

function Ctrl($scope) {
    $scope.bodyIsMenu = false;

    $scope.toggle = function() {
        $scope.bodyIsMenu = !$scope.bodyIsMenu;
    };
}

也是一个非常有趣的阅读here。

1 回答 1