我将ag-grid安装到了Angular 7应用程序中,并且正在遵循Enable Selection for ag-grid上的ag-grid教程。当我尝试导入AgGridNg2
时,我得到了Module ag-grid-angular/main has no exported member AgGridNg2.ts
。我只能假设此插件的文档已过时。我需要解决什么才能使其正常工作?这是我的component.ts:
import { Component, OnInit, Inject, ViewChild } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { AgGridNg2 } from 'ag-grid-angular';
@Component({
selector: 'app-sample',
templateUrl: './sample.component.html',
styleUrls: ['./sample.component.css']
})
export class SampleComponent implements OnInit {
@ViewChild('agGrid') agGrid: AgGridNg2;
columnDefs = [
{headerName: 'Make', field: 'make', sortable: true, filter: true, checkboxSelection: true },
{headerName: 'Model', field: 'model', sortable: true, filter: true },
{headerName: 'Price', field: 'price', sortable: true, filter: true }
];
rowData: any;
constructor(private http: HttpClient) {
}
ngOnInit() {
this.rowData = this.http.get('https://api.myjson.com/bins/15psn9');
}
}
编辑:这是package.json
{
"name": "webapplication12",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"build:ssr": "ng run WebApplication12:server:dev",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "7.2.5",
"@angular/common": "7.2.5",
"@angular/compiler": "7.2.5",
"@angular/core": "7.2.5",
"@angular/forms": "7.2.5",
"@angular/http": "7.2.5",
"@angular/platform-browser": "7.2.5",
"@angular/platform-browser-dynamic": "7.2.5",
"@angular/platform-server": "7.2.5",
"@angular/router": "7.2.5",
"@nguniversal/module-map-ngfactory-loader": "7.1.0",
"ag-grid-angular": "^21.0.1",
"ag-grid-community": "^21.0.1",
"ag-grid-ng2": "^8.0.0",
"aspnet-prerendering": "^3.0.1",
"bootstrap": "^4.3.1",
"core-js": "^2.6.5",
"jquery": "3.3.1",
"oidc-client": "^1.6.1",
"popper.js": "^1.14.3",
"rxjs": "^6.4.0",
"zone.js": "^0.8.29"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.13.5",
"@angular/cli": "~7.3.5",
"@angular/compiler-cli": "^7.2.8",
"@angular/language-service": "^7.2.5",
"@types/jasmine": "~3.3.9",
"@types/jasminewd2": "~2.0.6",
"@types/node": "~11.10.5",
"codelyzer": "~4.5.0",
"jasmine-core": "~3.3.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "^4.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.5",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.4.0",
"typescript": "~3.2.4"
},
"optionalDependencies": {
"node-sass": "^4.9.3",
"protractor": "~5.4.0",
"ts-node": "~5.0.1",
"tslint": "~5.9.1"
}
}
答案 0 :(得分:3)
尝试使用 AgGridAngular 代替 AgGridNg2
import { AgGridAngular } from 'ag-grid-angular';
...
@ViewChild('agGrid') agGrid: AgGridAngular;
答案 1 :(得分:0)
我正在使用Angular 8,并且@ViewChild('agGrid')期望有2个参数(但有1个),所以对我有用的很简单:
import { AgGridAngular } from 'ag-grid-angular';
...
private agGrid: AgGridAngular;