链接在被 Angular JS 包含时不再有效

link no longer works when included by Angular JS

本文关键字：包含时 不再 有效 JS Angular 链接      更新时间：2023-09-26

我开发了一个页面，当所有HTML都包含在一个HTML页面中时，它可以完美运行。但是，现在我已经让页面看起来和工作得很好，我想将其分解为包含，以便我可以在应用程序中创建更多页面，而无需重新创建菜单等。

一位代码是菜单，其中包括通过链接激活的下拉列表。

我正在使用 Angular JS 中的自定义指令来分解包含，所以我的菜单看起来像这样：

索引.html：

<sidebar-standard></sidebar-standard>

includes/sidebar-standard.html：

<li>
    <a href="javascript:;">my link</a>
    <ul class="sub-menu">
        <li>
            <a href="anotherlink.html">test</a>
        </li>
    </ul>
</li>

应用.js：

app.directive('sidebarStandard', function() {
    return {
        restrict: 'E', // E = Element Include
        templateUrl: '/includes/sidebar-standard.html'
    };
});

这有效，并且我的侧边栏包含在内，但javascript下拉菜单不再起作用。当我将HTML直接放入index.html时，一切正常，但是当我通过Angular添加它时，它不起作用。控制台日志中没有错误。

如何调试此问题？任何人可以提供的任何方向将不胜感激。

提前谢谢你！

为了跟进这个问题，我必须做的是一些评论建议的：在指令中包含点击控制功能。在查看了很多其他人的代码，并看到这个应用程序的前任作者做了什么之后，我最终从使用指令改为使用控制器。

所以，索引.html：

<div data-ng-include="'/includes/sidebar-standard.html'" data-ng-controller="SidebarController"></div>

应用.js

app.controller('SidebarController', ['$scope', function($scope) {
    $scope.$on('$includeContentLoaded', function() {
        Layout.initSidebar();
    });
}]);

传递 initSidebar（） 是关键。谢谢你们指路！非常感谢研究方向的帮助。=)

相关文章：