角度材料2包含jquery代码在组件不工作

Question

我建立了一个项目angular2-materialize。网页上的导航应该由HamburgerMenuComponent处理。

于是我开始包括该边栏：SideNav - Materialize

它工作正常，当我手动插入在浏览器的控制台$(".button-collapse").sideNav();。 但我不知道如何将其包含到HamburgerMenuComponent。

这是我试过到目前为止，但它不工作：

import { Component, OnInit, AfterViewInit } from '@angular/core'; 
import * as $ from 'jquery'; 

@Component({ 
    selector: 'app-hamburger-menu', 
    templateUrl: './hamburger-menu.component.html', 
    styleUrls: ['./hamburger-menu.component.css'] 
}) 
export class HamburgerMenuComponent implements OnInit, AfterViewInit { 

    constructor() { } 

    ngOnInit() { 
    } 

    ngAfterViewInit() { 
    $(".button-collapse").sideNav(); 
    } 
} 

AppComponent.html:1 ERROR TypeError: WEBPACK_IMPORTED_MODULE_1_jquery(...).sideNav is not a function

Answer 1

尝试编辑您的​​（新角CLI使用lib.ts代替，但是是一样的）然后重新编译：

// jQuery 
declare let jQuery: any; 

// Dependencies 
window['jQuery'] = require('jquery'); 
window['$'] = window['jQuery']; 
import 'jquery-ui-npm/jquery-ui.min.js' 

而在你的组件广告这一切后进口：

declare let $: any;