Javascript 使用引导和AngularJS-Navbar的折叠事件

所以我已经考虑了一些关于这个问题的问题，并没有找到一个适合我的解决方案

我正在使用Bootstrap（v3.3.5）在我的站点顶部创建一个导航栏菜单。我还使用AngularJS（V1.4.4）和AngularUI引导（V0.13.3）。当菜单折叠并显示时，您必须切换菜单按钮才能将其关闭。单击菜单链接或菜单外部没有效果

因此，我尝试了在Stackoverflow上讨论的几种解决方案，但没有一种对我有效。经过几个小时的努力，我想出了一个选项，可以在路线发生变化时关闭菜单（AngularJS$route），但我的代码似乎没有起作用。我想要一些建议

（功能（指令，未定义）
{
app.Modules.app.directive（“collaspeListener”，[function（）/*AngularJS指令*/
{
返回{
限制：“A”，
链接：功能（范围、元素、属性）{
$（'#navcollaspe'）.on（show.bs.collapse，function（）{/*Bootstrap collapse JS*/
控制台日志（“显示”）；
$rootScope.$on（'$routeChangeSuccess'，function（）{/*AngularJS$route*/
$（'#navcollaspe'）.collapse（'hide'）/*引导折叠JS*/
})
})
}
}
}]);
}（app.Directives=app.Directives |{}）

切换导航

























































因此，在查看了代码并做了更多研究之后，我找到了一种方法，可以在单击菜单中的链接时折叠菜单

我发现有几个地方拼写错误，在修复后，代码执行了
console.log（'show'）
，但没有其他内容。因此，我最终找到了一个关于如何正确使用AngularJS和Bootstrap并使用AngularUI的优秀教程。本教程由作者提供

因此，在调整代码以遵循Angular UI建议后，它将按预期工作。我还根据上面评论中的重新编译注入了
$rootScope
。我加入了新代码，希望它能为其他人节省一些时间和挫折感。：）


（功能（控制器，未定义）
{
app.Modules.app.controller（“navController”、[“$scope”、函数（$scope）
{
$scope.isCollapsed=true；
}]);
}（app.Controllers=app.Controllers |{}）；
（功能（指令，未定义）
{app.Modules.app.directive（“collapseListener”，['$rootScope'，function（$rootScope）
{
返回{
限制：“A”，
控制器：“导航控制器”，
链接：功能（范围、元素、属性）{
$rootScope.$on（“$routeChangeSuccess”，函数（事件、当前、以前、拒绝）{
if（scope.isCollapsed==false）{
scope.isCollapsed=true；
}
})
}
}
}]);
}（app.Directives=app.Directives |{}）

切换导航








Does
console.log（“显示”）执行过吗？此外，您似乎没有在任何地方注入
$rootScope
。不，它不会被执行。我需要在哪里注射？我是JS的新手。：）