1
저는 Ionic 2와 AG-grid를 처음 사용합니다. 필자는 예제 2의 템플릿 (sidemenu)을 가지고 놀았으며 Visual Studio 2015로 가져 왔습니다. 모두 잘 돌아가는 것 같습니다.ionic2에서 ag-grid를 사용하려고 할 때 오류가 발생했습니다.
사용할 데이터 격자를 찾고 ag-grid를 발견했습니다. 그래서 이오닉 2 응용 프로그램에서 이것을 탐구하고 싶었습니다. ..
지침 here에 따라, 나는 노드 패키지를 설치 한, 그래서 내가 테스트 .TS 파일로 가져오고 지시자를 포함했다
"ag-grid": "^4.2.7",
"ag-grid-ng2": "^4.2.2",
내 package.json에 다음 한
...
import {AgGridNg2} from 'ag-grid-ng2/main'
import {GridOptions} from 'ag-grid/main'
@Component({
directives: [AgGridNg2],
templateUrl: 'build/pages/aggrid-page/aggrid-page.html'
})
export class AgGridPage {
public data: Array<GridRow>;
public columnDefs;
public gridOptions: any;
public showToolPanel;
...
지금, 나는 있습니다 .. SystemX을 언급보다 라인을 어떻게 할 모르겠습니다
System.config({
packages: {
lib: {
...
그래서 아무 것도하지 않았습니다.
또한 index.html을
<link href="../node_modules/ag-grid/dist/styles/ag-grid.css" rel="stylesheet" />
<link href="../node_modules/ag-grid/dist/styles/theme-fresh.css" rel="stylesheet" />
의 CSS 파일을 포함했고 나는이 404 (경로로 올바른 것 왜 확실하지)를 얻고있다.
가장 큰 오류는 ag-grid 태그가 오류를 생성한다는 것입니다.
그래서 그러나
<ag-grid-ng2 #agGrid style="width: 100%; height: 350px;" class="ag-fresh"
[gridOptions]="gridOptions"
[columnDefs]="columnDefs"
[showToolPanel]="showToolPanel"
[rowData]="rowData"
// boolean values 'turned on'
enableColResize
enableSorting
enableFilter
// simple values, not bound
rowHeight="22"
rowSelection="multiple">
</ag-grid-ng2>
EXCEPTION: Error: Uncaught (in promise): Template parse errors:
Unexpected closing tag "ag-grid-ng2" ("
[ERROR ->]</ag-grid-ng2>
</ion-content>
"): [email protected]:2
그래서 ag-grid-ng2 태그를 좋아하지 않으므로 올바르게 설정하지 않았습니다.
이 ag-grid를 Ionic에 통합하는 데 더 많은 단계가 필요한지 아는 사람 있습니까? 거기에 ag-grid lib 파일을 app.bundle.js에 포함시킬 필요가있는 것이 있습니까? 스타일과 관련하여
rowHeight="22"
rowSelection="multiple"> <=== here
</ag-grid-ng2>
다음과 같은 오류가 core_1.NgModule입니다 (익명 함수) @ app.bundle.js : 49643378 ../ agComponentFactory @ app.bundle.js : 49655s @ app.bundle.js : 1 (익명 함수) @ app.bundle.js : 1380 ../ lib/agAware @ app.bundle.js : 49751s @ app.bundle.js : 1 (익명 함수) @ app.bundle.js : 11 ../ components/sidebar/sidebar @ app.bundle.js : 15s @ app.bundle.js : 1e @ app.bundle.js : 1 (익명 함수) @ app.bundle.js : 1 http : // localhost : 8100 /? restart = 719616로 이동 아이디어가 있으십니까? –