如何在angular5中使用jquery .counterUp函数？

Question

我想为我的公司网站创建一个计数器视图，为此，我必须使用jquery counterUp函数。

即使为它添加了脚本标签，Angular也无法识别该功能。

if(st >= hT ){
  $('.counter').counterUp({
    delay: 10,
    time: 2000
  });

计数器应从零开始并达到某个定义的数字。

Answer 1

假定“ .counter”引用的元素是Angular组件，则应使用ViewChild而不是jQuery。

例如，如果该元素属于Counter类，那么实现此影响的可能更好的方法是。

@ViewChild(Counter)
counter: Counter;

然后在代码块中看起来像这样。

if(st >= hT ){
  this.counter.counterUp({
    delay: 10,
    time: 2000
});

Answer 2

1. /安装jQuery

  

npm安装jquery

2. /打开angular.json并查找脚本

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

3. /转到您的组件并在顶部声明

declare var jQuery: any;

4. /和ngOnInit

  (function ($) {
     if(st >= hT ){
         $('.counter').counterUp({
           delay: 10,
           time: 2000
         });
  })(jQuery);