jQuery 函数 angular2/5答案

【问题标题】：Jquery function angular2/5jQuery 函数 angular2/5
【发布时间】：2018-04-30 06:13:07
【问题描述】：

我想在我的 angular5 项目中使用 jquery 库

问题：想要启用分页

使用 npm 安装 jquery

图书馆：http://pagination.js.org/

但是我在我的项目中添加了 jquery 和 pagnation js

angular-cli.json

  "scripts": [
   "../src/assets/script/custom.js",  //a custom script
    "../src/assets/script/paginathing.js" //the pagination script
  ],

typings.d.ts

declare var customs:any;
declare var paginathing:any;

app.component.ts

    import { Component, OnInit } from '@angular/core';

import * as customs from 'customs';
import * as paginate from 'paginathing';
import * as $ from 'jquery'
// declare var paginathing:any;
@Component({
  selector: 'app-root',
  templateUrl: './appeal.component.html',
  styleUrls: ['./appeal.component.css']
})
export class AppealComponent implements OnInit {
  data: any;
  p: number = 1;
  constructor(){

  }

  ngOnInit() {


    $('.table tbody').paginathing({ //paginathing
      perPage: 4,
    })

  }



}

错误

$(...).paginathing is not a function
at AppealComponent.ngOnInit

【问题讨论】：

使用 Angular 分页库。无论如何，Jquery 与 Angular 配合得并不好。
@Carsten 用谷歌搜索了很多，但 angular5 的分页没有运气
现在知道你用谷歌搜索了什么，但是在这里，一个有角度的材料分页器是一个好的开始。 material.angular.io/components/paginator/overview
您的问题解决了吗？

标签： javascript jquery angular angular5

【解决方案1】：

我建议您使用 Angular 的强大功能创建分页，而不是通过导入 jQuery。这样做真的很糟糕.. continue reading @Phil explanation here

检查这个example

【讨论】：