ngx perfect scrollbar update function undefined?

问题

This is the first time i'm trying to use perfect scroll so i might have missed something, but looking at the documentation it shows some functions that can be accessed using the directiveRef as follows

https://www.npmjs.com/package/ngx-perfect-scrollbar

following this i tried to use the update because i noticed the container wouldn't update with new items unless i resized the window so i checked the object only to find that the update function is undefined and missing from the directiveRef contrary to what is stated by the docs.

would really be thankful if anyone can shed light on this issue and point me in the right direction in case I missed anything along the way. Thank you

回答1:

That a traditional pattern which every js library follows, all the core functionality is added to the prototype, so that any changes to the object prototype would reflect in all the objects instances.

you can find more advantages of adding methods to prototype here

Image Reference:https://hackernoon.com/understand-nodejs-javascript-object-inheritance-proto-prototype-class-9bd951700b29

回答2:

fixed it by using https://npm.taobao.org/package/perfect-scrollbar I made a reference using Native element and then using update. like this

import PerfectScrollbar from 'perfect-scrollbar';

@ViewChild('perfectScroll') perfectScroll: ElementRef;
ps;

constructor(private psb: PerfectScrollService) {}

ngOnInit() {
    this.ps = new PerfectScrollbar(this.pScroll.nativeElement, {
      wheelSpeed: 2,
      wheelPropagation: true,
      minScrollbarLength: 20
    });
    this.psb.setBar(this.ps);
}

in my perfectScrollService I made an instance then called update everytime the content was changed

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class PerfectScrollService {
  perfectScrollBar: any;
  constructor() { }

  setBar(psb) {
    this.perfectScrollBar = psb;
  }

  update() {
    this.perfectScrollBar.update();
  }

}

and then used it like this

    let newData;
    this.data[i].subscribe(
      value => (newData = value.concat(response.data[0]))
    );
    this.data$[i].next(newData);
    this.psb.update();

来源：https://stackoverflow.com/questions/55234432/ngx-perfect-scrollbar-update-function-undefined

标签

javascript

angular

typescript

angular6

scrollbar