Fatal编程技术网
  • javascript/
  • 为什么使用jQuery的Javascript代码有时不'；t在Angular2应用程序中侦听事件？

为什么使用jQuery的Javascript代码有时不'；t在Angular2应用程序中侦听事件？

javascript jquery angularjs angular

为什么使用jQuery的Javascript代码有时不'；t在Angular2应用程序中侦听事件？,javascript,jquery,angularjs,angular,Javascript,Jquery,Angularjs,Angular,很久以前，我们购买了它，并在angularJS应用程序中使用了它，没有任何问题。 现在，对于另一个项目，我们已经切换到Angular 2，我们想要使用相同的主题，但我们得到了一个奇怪的行为：有时工作如预期，但大多数时间不工作。 我们已经使用firefox控制台检查了代码，这是工作时的结果： 这是不工作时的输出控制台： 出于（我的）未知原因，有时materialize.min.js没有监听事件。 不幸的是，由于版权问题，我无法发布materialize.min.js源代码，但我可以发布我的： in

很久以前，我们购买了它，并在angularJS应用程序中使用了它，没有任何问题。
现在，对于另一个项目，我们已经切换到
Angular 2
，我们想要使用相同的主题，但我们得到了一个奇怪的行为：有时工作如预期，但大多数时间不工作。
我们已经使用firefox控制台检查了代码，这是工作时的结果：
这是不工作时的输出控制台：
出于（我的）未知原因，有时
materialize.min.js
没有监听事件。
不幸的是，由于版权问题，我无法发布
materialize.min.js
源代码，但我可以发布我的：
index.html

<html>
  <head>
    <base href="/">
    <title>Angular QuickStart</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 1. Load libraries -->
     <!-- Polyfill(s) for older browsers -->
    <script src="node_modules/core-js/client/shim.min.js"></script>
    <script src="node_modules/zone.js/dist/zone.js"></script>
    <script src="node_modules/reflect-metadata/Reflect.js"></script>
    <script src="node_modules/systemjs/dist/system.src.js"></script>
    <!-- 2. Configure SystemJS -->
    <script src="systemjs.config.js"></script>
    <script>
      System.import('app').catch(function(err){ console.error(err); });
    </script>


      <link href="css/materialize.min.css" type="text/css" rel="stylesheet" media="screen,projection">
      <link href="css/style.min.css" type="text/css" rel="stylesheet" media="screen,projection">
      <link href="css/layouts/style-fullscreen.css" type="text/css" rel="stylesheet" media="screen,projection">
  </head>
  <!-- 3. Display the application -->
  <body>
    <my-app>Loading...</my-app>
    <!--materialize js-->  
   <script
              src="https://code.jquery.com/jquery-3.1.1.min.js"
              integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
              crossorigin="anonymous"></script>
    <script type="text/javascript" src="js/materialize.min.js"></script>
  </body>
</html>


角度快速启动
System.import（'app'）.catch（函数（err）{console.error（err）；}）；
加载。。。
应用程序组件.ts

import { Component } from '@angular/core';
@Component({
  selector: 'my-app',
  template: `
      <header-navbar></header-navbar> 
          <div id="main">
            <!-- START WRAPPER -->
            <div class="wrapper">
              <navbar></navbar>
              <section id="content">
                <div class="container">
                  <router-outlet></router-outlet>
                </div>
              </section>
            </div>
          </div>
      `
})
export class AppComponent { }

从'@angular/core'导入{Component}；
@组成部分({
选择器：“我的应用程序”，
模板：`
`
})
导出类AppComponent{}
编辑
即使我使用jQuery的本地副本也无法正常工作。

如果您的materialize.min.js依赖jQuery，我会怀疑它有时能正常工作，而不是其他原因是您的CDN链接并非总是正确加载。我可能建议下载jQuery的副本并从您控制的本地源加载它

编辑：当你从本地源加载时说“不工作”，你的意思是它有时仍然工作，但不一致吗？或者你的意思是根本不工作？

有时仍在工作，在接下来的几天里，我将尝试使用服务器端渲染来查看是否有改进