gpt4 book ai didi

javascript - NG 包含范围

转载 作者:搜寻专家 更新时间:2023-10-31 08:26:30 26 4
gpt4 key购买 nike

我已经阅读了大量有关 ng-include 范围问题的文章,但似乎没有一篇能解决我正在尝试做的简单事情。希望有人可以澄清。这是我正在尝试做的事情的简化版本,但封装了问题。

这是主页面

<!DOCTYPE html>
<html lang="en" ng-app="MyApp">
<head >
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/simple-sidebar.css" rel="stylesheet">
</head>
<body>
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/angular.min.js"></script>
<script>
var app = angular.module('MyApp', []);
</script>
<div ng-include="'/Menu.html'" ></div>
</body>

</html>

这里是 Menu.html

    <div id="sidebar-wrapper" ng-app="MyApp" ng-controller="MenuController">
<ul class="sidebar-nav">
<li class="sidebar-brand">
<a href="#">
Header
</a>
</li>
<li>
<a href="\Login.html">Sign In</a>
</li>
<li ng-repeat="menuItem in MainMenu.Labels">
<a href="#">{{menuItem}}</a>
</li>
</ul>
<script>

app.controller('MenuController', function($scope) {
$scope.MainMenu = {"Labels":["Status","Setup"]} // this code never executes
});
</script>
</div>

如何在 menu.html 中创建用于绑定(bind)的变量...我可以在外部执行此操作,但我们的引擎将在请求该文件时生成菜单...

最佳答案

在这种情况下,您面临的问题实际上不是范围问题,而是您如何设置 Angular 应用程序。通过将初始化并将 Controller 分配给应用程序的代码放在包含中,当 Angular 尝试编译新包含的 View 时,MenuController 是未定义的,代码将永远不会运行,实际上应该在控制台中抛出错误。我会推荐以下之一:

  1. 从模板本身中删除 Angular 脚本,并将它们设置在自己的文件中,并将整个应用及其模块设置为在运行前初始化。

  2. 虽然我不完全理解您所说的引擎生成菜单是什么意思 - 听起来您正在尝试使用模板语言实际生成脚本标签之间的文字 javascript,从各种 View 模型到设置值。如果是这种情况,我会建议不要这样做并使用 Angular 服务和 $http提供程序进行 ajax 调用以在内存中设置这些值。

  3. 如果您必须以这种方式构建您的应用程序,您将不得不研究使用像这样的库延迟加载 Controller - https://github.com/matys84pl/angularjs-requirejs-lazy-controllers .我没有使用过它,但通过快速浏览自述文件​​,它似乎能够解决您的问题,同时维护您的应用程序的结构。

关于javascript - NG 包含范围,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34168744/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com