Wie importiert man $ aus jQuery.min.js in die Angular 2 App? Name nicht gefunden

Question

Ich habe eine Angular 2 App mit Typescript. Ich möchte $ für eine Vielzahl von Aufgaben jQuery verwenden, wie

$(document).ready(function(){  // throwing error: "[ts] Cannot find '$'. any" 
    console.log("loaded up!"); 
    $("#main_div").niceScroll(); 
}) 

ich importiert haben die jQuery.min.js-Datei in meine app über index.html wie so:

<script src="app/libs/jquery.min.js"></script> 

Aber ich habe nichts in die Datei app.component.ts in Bezug auf den jQuery-Code importiert. Ist es notwendig, und wenn ja, wie importiere ich es?

import { GenericService } from './services/Generic.service';  // did not do this 
import $ from './libs/jquery.min.js';        // tried this but does not work 

Überraschenderweise mein Code arbeitete als ich gestern war die Entwicklung, aber nicht heute, wenn ich npm start lief. Könnte mir jemand mit diesem Import-Prozess helfen?

Answer 1

Einfach ein

typings install jquery --ambient --save 

die Typ-Definitionsdatei zu installieren. Entfernen Sie die import $ from './libs/jquery.min.js'; und fügen Sie einen Verweis auf die Datei d.ts an der Spitze Ihres app.component.ts wie so:

/// <reference path="../typings/jquery.d.ts"/> 

Da Sie bereits die Javascript-Datei in Ihrem Index Laden Sie nur die Typisierungen für sie benötigen, so Typoskript weiß , dass diese Namen und Methoden von jQuery existieren.

Answer 2

Fügen Sie einfach JQuery mit Typisierungen:

typings install jquery --ambient --save 

Dann in Ihrem Index:

<script src="bower_components/jquery/dist/jquery.min.js"></script> 

Und normalerweise wird Typoskript den Job :)