Question

我正在对jangle 7项目使用jquery scrollify。我已经使用此命令安装了jquery-scrollify

npm i jquery-scrollify

，然后将其路径添加到angular.json

"node_modules/jquery-scrollify/jquery.scrollify.js",

并在我的第一个组件中使用了此代码

$.scrollify({
    section : ".sectionCommon",
    sectionName : "section-name",
    interstitialSection : "",
    easing: "easeOutExpo",
    scrollSpeed: 1100,
    offset : 0,
    scrollbars: false,
    standardScrollElements: false,
    setHeights: true,
    overflowScroll: true,
    updateHash: false,
    touchScroll:true,
    before:function() {},
    after:function() {},
    afterResize:function() {},
    afterRender:function() {}
});

和scrollify开始显示其对那个组件的影响，但是当它开始显示对其他组件的影响时也会发生问题。页面停止滚动。我在其他组件上尝试了以下代码，但不起作用

$.scrollify.disable();

或

$.scrollify.destroy();

请向我展示在angular 7中添加jquery scrollify的正确方法

Answer 1

首先导入并在组件中声明jquery

import * as jQuery from 'jquery';
declare var jQuery: any;

和ngAfterViewInit（）函数使用jquery scrollify插件。

  ngAfterViewInit() {
    jQuery.scrollify({
      section : "section",
      sectionName : "section-name",
      interstitialSection : "",
      easing: "easeOutExpo",
      scrollSpeed: 1100,
      offset : 0,
      scrollbars: true,
      standardScrollElements: "",
      setHeights: true,
      overflowScroll: true,
      updateHash: true,
      touchScroll:true,
      before:function() {},
      after:function() {},
      afterResize:function() {},
      afterRender:function() {}
    });
  }

如何仅在angular 7的一个组件中使用jquery-scrollify？

1 个答案: