javascript - $ 没有在 Angular 2 中使用 JQuery 定义

Question

全部我正在使用 Angular 2 制作一个小型网络应用程序，我想在其中使用 JQuery。我在 chrome 中遇到错误，我不知道为什么这是错误:

   core.umd.js:3004 EXCEPTION: Uncaught (in promise): Error: Error in `enter code here`http://localhost:3000/app/dashboard.component.js class DashboardComponent_Host - inline template:0:0 caused by: $ is not defined
ReferenceError: $ is not defined
    at DashboardComponent.ngOnInit (http://localhost:3000/app/dashboard.component.js:22:9)
    at Wrapper_DashboardComponent.detectChangesInInputProps (/AppModule/DashboardComponent/wrapper.ngfactory.js:18:53)
    at _View_DashboardComponent_Host0.detectChangesInternal (/AppModule/DashboardComponent/host.ngfactory.js:30:32)
    at _View_DashboardComponent_Host0.AppView.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9305:18)
    at _View_DashboardComponent_Host0.DebugAppView.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9410:48)
    at ViewRef_.detectChanges (http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:7398:24)
    at RouterOutlet.activate (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:3458:46)
    at ActivateRoutes.placeComponentIntoOutlet (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:2955:20)
    at ActivateRoutes.activateRoutes (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:2933:26)
    at eval (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:2902:23)

这是我的代码:

import { Component, ElementRef, OnInit } from '@angular/core';
declare var $:JQueryStatic;
@Component({
    moduleId: module.id,
    selector: 'my-dashboard',
    templateUrl: 'dashboard.component.html',
    styleUrls: ['dashboard.component.css'],
})
export class DashboardComponent implements OnInit{

    constructor(private elRef: ElementRef){}

    ngOnInit():any{
        $(this.elRef.nativeElement).find('button').on('click', function() {
           alert('It works!');
        });
    }
}

我使用这个答案来安装 jquery 并按照解释执行了所有操作，但不起作用。 link有什么想法吗？谢谢

<小时/>

修复我通过更改 declare var $:JQueryStatic; 修复了它至declare var $:any;并包括<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>进入index.html

Answer 1

在layout.cshtml上使用cdn

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js" ></script>