javascript - Angular 6 + jQuery + fullpage.js

标签 javascript jquery angular fullpage.js

我正在尝试在没有 ngx-fullapge 的情况下使用 fullpage.js,我面临着一些与导入相关的问题:

首先,jquery 似乎不起作用,即使包已设置...

在一个非常简单的 AppComponent 类定义中,我有:

import { Component, OnInit } from '@angular/core';
import * as $ from 'jquery';
import * as fullpagejs from 'fullpage.js';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ],
})
export class AppComponent  implements OnInit {
  public items = [1, 2, 3];

  public ngOnInit() : void {
    $('#fullpage')
  }
}

使用一个非常简单的模板:

<div id="fullpage">

  <div class="section" id="landing">
    Landing
  </div>

  <div class="section" *ngFor="let item of items; let i = index" id="document_{{ i }}">
    Document {{ item }}
  </div>

  <div class="section" id="general-information">
    General Information
  </div>

</div>

angular.json 有以下脚本:

 "scripts": [
          "./node_modules/jquery/dist/jquery.min.js",
          "./node_modules/fullpage.js/dist/jquery.fullpage.min.js"
        ]

我有以下错误:

ERROR
Error: $ is not a function

我在这里创建了一个重现问题的在线项目:https://stackblitz.com/edit/angular-nrrujn

如何在此项目中同时使用 jQuery 和 fullpage.js?

[编辑]

jQuery 与 import $ from 'jquery'; 一起工作,但是仍然找不到来自 fullpage.js 的 fullpage() 方法。 我更新了 stackblitz:https://stackblitz.com/edit/angular-nrrujn

最佳答案

确保你有 jquery.fullpage.min.js 文件存在于目录 './node_modules/fullpage.js/dist/jquery.fullpage.min.js'

关于javascript - Angular 6 + jQuery + fullpage.js,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51412089/

相关文章:

node.js - typescript 无效

javascript - Angular 2 : Communication between sibling components

javascript - 使用 javascript 将占位符添加到多个输入字段(具有相同的类)

jQuery 函数在模态中不起作用

javascript - 在同一位置淡入和淡出文本

jquery - 使用 jQuery 为滚动的导航栏设置动画

使用 WebApi 上传 Angular2 文件

javascript - 配置同时打开 WebSocket 的最大数量(在 IE 中)

javascript - 使用open.window()在新窗口中打开js程序

javascript - 等待响应时暂停 JavaScript 执行