程序员经验分享-hwhale

我应该使用哪种方法来手动引导我的 AngularJS？

2023-12-25

我看到了以下内容：

angular.bootstrap(document, ['TodoApp']);
angular.bootstrap(angular.element("body")[0], ['TodoApp']);

AngularJS 文档也提到了这一点，我不太明白。

   angular.element(document).ready(function() {
     angular.bootstrap(document);
   });

这些方法有什么区别吗？特别是 Angular 文档中的最后一个方法在做什么？其中一个比另一个更好用吗？


它们大致相同，但有一些差异：

angular.bootstrap(document, ['TodoApp']);

如果您加载了脚本，这将起作用在该页的末尾（而不是在标题中）。

否则，在启动应用程序时将不会加载 DOM（不会编译任何模板，指令不会产生任何效果）。

这个有效：plnkr http://plnkr.co/edit/YC3bET2U3NWJGVeBnACw?p=preview

这个没有：plnkr http://plnkr.co/edit/CC67YoIbUGhdtcpjW2Nd?p=preview 

angular.bootstrap(angular.element("body")[0], ['TodoApp']);

和之前一样，使用body作为应用程序的根。它使用了 jqLit​​e 中不可用的选择器，因此您需要有完整的 jQuery包含在应用程序中。

我不确定使用有什么好处body反而document，但可能与端到端测试，正如本节中所解释的comment https://github.com/karma-runner/karma/issues/422

plknr http://plnkr.co/edit/h61lHJRVCSmWG8nLZHEu?p=preview

angular.element(document).ready(function() {
  angular.bootstrap(document);
});

这个其实等待 DOM被加载，因此即使您将脚本包含在标头中它也会工作。

这与jQuery的基本相同$(document).ready(，但是使用jqLite's angular.element.

在最后一个示例中，没有模块被传递给引导函数，很可能您需要声明主模块，除非您的应用程序仅包含全局命名空间中的控制器。

因此，最后一个选项将如下所示，以便与其他两个选项类似：

angular.element(document).ready(function() {
  angular.bootstrap(document, ['TodoApp']);
});

plknr http://plnkr.co/edit/AC0iJBQEJcRTd1LLfsn3?p=preview

我想大多数时候最安全的选择是使用最后一种方法。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

angularJS

我应该使用哪种方法来手动引导我的 AngularJS？ 的相关文章

  • 如何删除 ng-repeat 的默认顺序

    如何停止动态表数据的 ng repeat 内部的默认排序 目前我收到以下订单 地址 客户 ID 姓名 但我想要的是以下顺序 客户 ID 名称 地址 任何帮助我将不胜感激 JS app controller MyController func

  • 以角度选择项目后保持菜单打开

    单击我的菜单后 我的菜单将关闭toggleShare按钮 我怎样才能防止这种情况 我将 angularJS 与 Angular 材料一起使用 这是我的代码

  • 如何销毁角度工厂实例

    一方面 我有几个工厂 每个工厂都控制一个 websocket 另一方面 其中一个工厂应该在客户端登录时启动 因此 if user isLogged injector get NotificationsWebsocket 这就是我动态初始化工

  • 传递给 $resource 的 @id 是什么？

    resource entries id id id update method PUT id是什么 在 资源上doc page http docs angularjs org api ngResource 24resource下面有人这么说

  • 在 Angular 中让多个调用等待同一个 Promise

    我在一个页面上有多个使用相同服务的控制器 为了举例 我们将服务称为 USER 第一次调用 USER getUser 时 它会发出 http 请求来获取有关用户的数据 调用完成后 它将数据存储在 USER data 中 如果再次调用 USER

  • $resource.query 返回分割字符串（字符数组）而不是字符串

    我正在使用像下面这样的 Angular resource angular module app factory data function resource var Con resource api data update method P

  • AngularUI 可排序不适用于多个应用程序

    我创建了带有可排序列表的 angularjs 应用程序 我的应用程序可以与其他不同的应用程序一起多次包含在页面中 每个角度应用程序都是独立的用户控制 var myapp angular module myapp ui myapp contr

  • 如何使用 ng-repeat 复选框和 Angularjs 过滤表格

    曾几何时 这是可行的 但不知何故它被破坏了 我希望能够使用 ng repeat 生成复选框 以根据存储的数据获取所需数量的复选框 并使用它们来过滤生成的表 此外 我不希望重复复选框的相同值 我用代码做了一个plnkr div class r

  • 如何在 AngularJS 中从 ng-include 切换控制器值？

    我正在使用 AngularJS 我有一个header html我已经使用 ng include 将该 html 页面合并到另一个 html 中 另外 我有一个下拉列表header html我希望显示所选值 从下拉列表中 列表 我怎样才能做到

  • Angular JS $location.path(...) 不触发路由控制器

    所以我尝试使用更新表单提交上的路径 location path search 但它没有触发注册的路线 search 我也尝试过使用尾部斜杠 没办法 我也试过了 scope apply但我刚刚得到 apply already in progr

  • 如何禁用 Angular 数据表中数据的初始排序？

    我正在使用角度数据表 并且只有一列 当我绑定它时 数据按升序排列 而我想按我收到的顺序显示它 有人可以帮忙吗 控制器 var vm this vm dtOptions DTOptionsBuilder newOptions withButt

  • 如何发布数组多维角度js

    我在 angularjs 中有一个数组 示例如下 scope order qty 20 scope order adress Bekasi scope order city Bekasi 这个数组可以用这个代码发布 http method

  • Typescript：如何在自定义过滤器中使用角度 $filter

    如何在自定义过滤器中使用 Angular filter 如何注入 filter依赖 module Filters export class CustomFilter public static Factory return function

  • AngularJS 输入字段未从控制器内的 setTimeout 更新

    我正在使用 AngularJS 支持的页面 并且我需要在只读输入文本字段内显示正在运行的时钟 与data ng model 为了模拟运行的时钟 我使用了 JavaScript 调度程序setTimeout每 1000 毫秒调用一个函数 该函

  • 父指令属性更改时子指令不会更新

    这是对这两个问题的后续 在父指令和子指令之间传递参数 https stackoverflow com questions 42814530 pass argument between parent and child directives

  • 为什么混合插值和表达式是不好的做法

    来自文档 在表达式内嵌入插值标记 Note AngularJS 指令属性采用任一表达式or带有嵌入表达式的插值标记 已经被考虑了不好的做法将插值标记嵌入表达式中 AngularJS 开发人员指南 插值 https docs angularj

  • 测试 AngularJs 的 $http.defaults.headers.common 是否设置了特定标头

    所以我对 JavaScript 和 AngularJS 的世界还是个新手 因此我的代码还没有达到应有的水平 但它正在改进 尽管如此 我开始学习并实现一个带有 REST 后端的简单登录页面 提交登录表单后 将返回一个身份验证令牌并将其设置为默

  • jquery.find() 可以只选择直接子项吗？

    我应该向 jQuery find 提供什么参数来选择元素子元素而不选择其他元素 我不能用 gt 引导选择器 而用 将选择所有后代 而不仅仅是直接子代 我知道 jQuery children 但这是一个库 因此用户能够提供自己的选择器 并且我

  • 使用 Angular 下载具有动态 src 的脚本

    Angular 提供了通过动态名称动态加载模板的方法ng include 该部分中的内联 JS 和 CSS 可以正常加载 但没有一个好的方法来下载带有动态 url 的脚本 我们需要下载脚本 相对于调用它们的 html 部分的路径 即我们有一

  • 动态img（或视频）标签根本不加载资源，HTTP请求处于“待处理”状态

    我尝试使用以下方法在 Web 应用程序上加载资源时遇到一些问题img or videoHTML 标签 我在我的应用程序中使用 Angular 并动态设置src的参数img标签 使用ng src src 指示 没有那么多图像和资源需要加载 在

随机推荐

  • GCC 汇编优化 - 为什么它们是等价的？

    我正在尝试在初级水平上学习汇编是如何工作的 所以我一直在玩 Sgcc 编译的输出 我编写了一个简单的程序 它定义两个字节并返回它们的总和 整个程序如下 int main void char A 5 char B 10 return A B

  • Java Clip 类中的 Drain 方法

    我正在创建一个短片 然后播放它 调用start 方法 然后我打电话给drain 方法阻止执行 直到剪辑播放完成 然而 当多次运行下面的代码时 有时有效 有时无效 并且声音在结束前随机停止 Mixer mixer AudioSystem ge

  • AccountManager 和签名检查

    安全提示 https developer android com training articles security tips html Crypto相关章节AccountManager提到 如果凭据仅由您创建的应用程序使用 您可以 使用

  • 为什么要费心使用 ArrayList(intcapacity) 呢？

    因此 几乎每个与 ArrayList 容量相关的问题都是如何使用它或 奇怪地 访问它 我对这些信息非常熟悉 我感兴趣的是 如果您碰巧知道或粗略地知道 ArrayList 中有多少项 是否真的值得使用设置容量的 ArrayList 构造函数

  • Android WebView-记住用户名和密码

    我正在制作一个基本的 WebView 应用程序 它将加载网页 该网页需要登录信息 当我导航出或刷新页面时 它会将我注销 我如何保持登录状态 以下代码是我基于一些研究的尝试 但显然我不理解这个概念 所以我可以一石二鸟 有人可以告诉我如何防止旋

  • 不同线路在不同平台结束的历史原因

    为什么 DOS Windows 和 Mac 决定使用 r n 和 r 作为行结尾而不是 n 难道这只是试图与Unix 不同 的结果吗 现在 Mac OS X 是 Unix 类似 Apple 是否从 r 切换到 n DOS 从 CP M 继承

  • 如果存在数据，则根据行 ID 替换为另一列中的数据

    我想替换列rep1 到rep4 中的数据 这些列中的数据与第一列中的唯一 ID 匹配 我想将rep1 rep4 列中的数据替换为具有相应ID 行的值列中的数据 因此 对于第二行 b 我想将 rep1 列中的 a 替换为 a 行中的相应值 在

  • 按创建顺序列出一台 SQL Server 上的所有数据库

    我在这个 SQL Server 2005 实例上可能有超过 100 个数据库 我想按照创建日期的顺序列出它们 或者更好的是 按照对任何表的最新修改的日期的顺序列出它们 是否有我可以编写的 SELECT 查询 同样重要的是 我可以在什么上下文

  • 将加密的信用卡号存储在 SQL 数据库中

    我想知道最好的存储方法是什么加密的信用卡号在 SQL 数据库中C net 框架 我应该使用手动执行此操作吗String SecureString Byte Array与某种symmetric encryption 我听说作为替代方案 可能是

  • 如何在 Gradle 构建期间转换 .properties 文件？

    作为 Gradle 中部署任务的一部分 我想更改以下属性的值foo properties指向生产数据库而不是开发数据库 我不想完全替换整个文件 因为它相当大 这意味着我们必须维护两个仅在一行上不同的单独版本 实现这一目标的最佳方法是什么 您

  • Android 推送通知可靠吗？ [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我想知道是否可以使用推送通知消息而不是服务 或者换句话说 推送通知传递是否完全可靠 我知道IOS不可信 但我不确定Google是否保证

  • 用于保存已解析 CSV 文件内容的数据结构

    我试图找出用 Java 解析 csv 文件的最佳方法是什么 现在每行将有 X 数量的信息 例如 第一行最多可以有 5 个字符串单词 用逗号分隔它们 而接下来的几行可能有 3 或 6 个或其他 我的问题不是从文件中读取字符串 只是要明确一点

  • 公共存储库中的私有文件夹（子模块）

    我有一个公共存储库 在其中我想使用一个私有的子模块 如果我将此子模块包含到我的公共存储库中 每个人都能够看到该子模块的内容吗 否 在公共存储库中包含子模块意味着将其 URL 记录在公共 gitmodules 文件中 通过存储库的递归克隆访问

  • 搜索引擎是否尊重 HTTP 标头字段“Content-Location”？

    我想知道搜索引擎是否尊重HTTP 标头字段Content Location http www w3 org Protocols rfc2616 rfc2616 sec14 html sec14 14 例如 当您想要从 URL 中删除会话 I

  • 如何为 Haskell 实例赋予具体值？

    我正在尝试学习 Haskell 但我对这个臭名昭著的 刚性类型变量 错误有点困惑 这是我的代码的相关部分 class Ord v gt Vector v where distance v gt v gt Double with Flexib

  • 如何只在 IE 上破解 css 内联样式？

    如何破解仅在 IE 上的 css 内联样式 只在所有版本的 IE 上破解 css 内联样式 我该怎么办 像那样 div style color eee border 1px solid 000 line height 32px div 你需

  • PyQt5：检查鼠标是否在输入事件中按下

    我的实际应用程序比这复杂得多 但下面的示例总结了我的大部分问题 我有多个 QLabel 我对它们进行了子类化以使它们可单击 标签显示 16x16 图像 需要通过 Pillow 加载图像 将其转换为 ImageQt 对象 然后设置标签的像素图

  • 带下划线前缀的受保护属性

    Like public foo null bar 10 protected stuff null moreStuff 5 似乎很多人都这样做 为什么 这不是不一致的命名吗 就像某些 PHP 函数一样 这是 php5 之前的旧约定 Php4

  • Ipython raw_input 可以解决吗？

    我正在运行一个Python程序 它想要接受raw input 而Ipython笔记本不这样做 已知的限制 实现该功能的推荐方法是什么 解决方法 我想做的是能够运行程序 接受输入并响应 将根据检索到的信息确定选择 并提示输入用户 ID 和密码

  • 我应该使用哪种方法来手动引导我的 AngularJS？

    我看到了以下内容 angular bootstrap document TodoApp angular bootstrap angular element body 0 TodoApp AngularJS 文档也提到了这一点 我不太明白 a

热门标签