使用Systemjs时检测页面上是否加载了Angular

2024-03-29

UPDATE:

这个问题专门讲了角2,现在是过时的。在发布时,没有办法检测它是否已加载到页面上。我还没有测试过其他版本,但是 Angular 8 现在有一种简单的方法来检测这一点,并且已经在下面的答案中指出了。


我正在尝试找出一种好的(最好是最好的)方法来检测 Angular 是否加载到页面上。

我看了这个问题:检测当前页面是否加载AngularJS的方法 https://stackoverflow.com/questions/13469466/ways-to-detect-whether-angularjs-is-loaded-in-the-current-page-or-not,但答案只是说明使用window.angular,这是我尝试的第一件事(早在找到答案之前)。似乎 systemjs 导致 Angular 不在全局(窗口)范围内。

这是我的 html 文件的头部:

<script src="client/node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="client/node_modules/systemjs/dist/system.src.js"></script>
<script src="client/node_modules/rxjs/bundles/Rx.js"></script>
<script src="client/node_modules/angular2/bundles/angular2.dev.js"></script>
<link rel="stylesheet" href="client/styles/main.css"/>

<script>
  System.config({
    packages: {        
        client: {
            format: 'register',
            defaultExtension: 'js'
        }
    }
  });
  System.import('client/app')
        .then(null, console.error.bind(console));
</script>

基于这个问题 https://stackoverflow.com/questions/34651079/when-should-i-concat-angular2-app-as-opposite-to-systemjs-approach,以及我对http2的理解,我没有看到不使用systemjs的真正原因。

显然,我可能是错的,systemjs 可能不是问题的原因;不管,window.angular即使我正在查看我的 Angular 应用程序,也会返回未定义。

为了给您提供我们的用例,如果有帮助的话,我们正在通过一个初始化文件加载一个角度应用程序,该文件将在其他网站上使用(在大多数情况下我们不控制页面)。我们希望我们的初始化文件是能够检测页面中是否已包含其他依赖项中的 Angular2(以及正确的版本)。如果没有,我们会动态添加他们没有的内容来满足我们的需要。 (这种方法可能还存在一些其他问题,但我们会在到达那里后解决这些问题。)

Summary

  1. 我们需要检测页面上是否加载了 Angular,以及什么版本。
  2. 使用systemjs,window.angular返回未定义。
  3. Angular 应用程序运行良好,没有任何问题。
  4. 对于 http2,我们认为没有必要不使用 systemjs 加载 Angular,但我们并不反对在必要时进行更改。

我使用以下方法成功检测到 Angular2:

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

使用Systemjs时检测页面上是否加载了Angular 的相关文章

  • 两个服务如何以双向方式相互通信?

    一种是通过事件 另一种是通过调用方法 我试图在我的应用程序中实现聚合模式 我有 AuthService 在这里我处理身份验证结果并发出事件 if auth this eAuth emit true else this eAuth emit
  • 应该使用encodeURI吗?

    javascript 的encodeURI 函数有任何有效用途吗 据我所知 当您尝试发出 HTTP 请求时 您应该 完整的 URI 您想要放入 URI 中的某些片段 可以是 unicode 字符串或 UTF 8 字节序列 在第一种情况下 显
  • React 无法识别 DOM 元素上的 `isActive` 属性 - styled-components

    我有以下内容svg我传递道具的组件 import React from react export default props gt
  • 无法使用 Jade 模板包含相对路径文件

    当我尝试将文件包含在同一文件夹中时 收到以下错误 the filename option is required to use include with relative paths 有两个文件 索引 jade 项目列表 jade cont
  • Sequelize 关联 - 请改用 Promise 风格

    我正在尝试将 3 张桌子连接在一起Products Suppliers and Categories然后排SupplierID 13 我读过了如何在sequelize中实现多对多关联 https stackoverflow com a 25
  • codePointAt 和 charCodeAt 之间的区别

    有什么区别String prototype codePointAt and String prototype charCodeAt 在 JavaScript 中 A codePointAt 65 A charCodeAt 65 从 MDN
  • 如何使用 JavaScript 上传文件而不进行回发?

    我正在 ASP NET 中进行文件上传 我用了
  • 如何使用 JavaScript 压缩文件?

    有没有办法使用 JavaScript 来压缩文件 例如 在雅虎邮件中 当您选择下载电子邮件中的所有附件时 它会被压缩并下载到单个 zip 文件中 JavaScript 能够做到这一点吗 如果是这样 请提供一个编码示例 我发现这个图书馆叫js
  • 如何将 vue3-openlayers 插件添加到 nuxt

    我有以下 main ts 文件Vue3 https v3 vuejs org import createApp from vue import App from App vue How to do this in nuxt3 import
  • linkedin js 如何是有效的 javascript

    LinkedIn Javascript 集成是通过以下方式完成的 我不明白 这怎么是一个有效的javascript 为什么 api key 没有被引用 脚本标签的主体带有src永远不会被执行 但是 加载的脚本可以像访问任何其他元素的内容一样
  • 全日历与 UTC 和本地日期的混淆

    我确实让 fullcalendar 正常初始化 所以它代表当前日期 午夜 gt 午夜 1 天 1 小时时段 我从其他一些数据源获取带有时间戳的数据 格式为 YYYY MM DD HH mm 作为字符串传输 无时区信息 因此 我将该字符串转换
  • Nodejs 异步 Promise 队列

    我需要使用速率受限的 API 例如 我一秒钟只能进行 10 个 API 调用 因此我需要等待当前秒结束才能进行另一个 API 调用 为了实现这一目标 我想创建一个可以自行管理的异步队列 它的主要功能是让我向队列添加一个新的 Promise
  • 如何创建显示/隐藏 Docusaurus 项目中所有详细标签状态的按钮?

    根据讨论here https stackoverflow com questions 58579048 how to add or remove the open attribute from all details tags in a r
  • Lodash _.hasIntersection?

    我想知道两个或多个数组是否有共同的项目 但我不在乎这些项目是什么 我知道 lodash 有一个 intersection方法 但我不需要它来遍历每个数组的每个项目 相反 我需要类似的东西 hasIntersection一旦找到第一个常见的出
  • 数据表 - 从 AJAX 源过滤数据

    我有一个数据表 正在从 api 获取数据 现在我的状态是活动的 非活动的 如果标志是活动的 那么我需要在数据表中显示 否则我不应该显示过期的 这是我的fiddle https jsfiddle net lakshmipriya001 qLp
  • mat-tab-group 不是 Angular 9 中的已知元素

    我正在使用 Angular 9 和 Angular Material 9 2 4 我正在尝试使用mat tab 组在我的 component html 中 但我不断收到错误 mat tab group is not a known elem
  • 单击 html 中的按钮后如何从 javascript 函数写入文件

    我正在尝试编写真正基本的代码 在 html 文件上按下按钮后 通过 JavaScript 函数在本地写入 txt 文件 这不可能吗 我可以仅使用 javascript 文件写入文件 但在尝试同时使用两者时则不能
  • JS - 如何将图像对象变成灰度并显示它

    基本上 当单击按钮时 它会告诉移动设备转到相机 一旦相机拍照 它就会给我图像数据 它被称为数据 URL 吗 这是我处理它的代码 var imagesrc data image jpeg base64 imageData var myimag
  • 如何使用node.js获取屏幕分辨率

    我需要使用 node js 获取屏幕分辨率 但以下代码不起作用 var w screen width var h screen height 这也行不通 var w window screen width var h window scre
  • 如何向 SvelteKit/Vite 应用添加版本号?

    我正在尝试在我的 SvelteKit 应用程序中创建一个系统 它会在某个页面上向您显示有关当前应用程序版本的信息 最好是 Git 提交哈希和描述 我尝试使用Vite的定义功能 https vitejs dev config define在构

随机推荐