level 2
angular报错:
More than one component matched on this element.
Make sure that only one component's selector can match a given element.
Conflicting components: jqxGridComponent,jqxGridComponent ("ers'" [icon]="'fa-table'"></app-page-header> <div class="row"> <div class="col col-xl-6 col-lg-12"> [ERROR ->]<jqxGrid #myGrid [width]="850" [source]="dataAdapter" [showstatusbar]="true" [renderstatusbar]="creat"): ng:///UsersModule/UsersComponent.html@0:157
具体代码在下面,谢谢各位大神了
2017年08月16日 07点08分
1
level 2
user.component.ts:
import { Component, ViewChild, AfterViewInit } from '@angular/core';
import { routerTransition } from '../../router.animations';
import { jqxGridComponent } from 'jqwidgets-framework/jqwidgets-ts/angular_jqxgrid';
import { jqxDropDownListComponent } from 'jqwidgets-framework/jqwidgets-ts/angular_jqxdropdownlist';
import { jqxInputComponent } from 'jqwidgets-framework/jqwidgets-ts/angular_jqxinput';
import { jqxButtonComponent } from 'jqwidgets-framework/jqwidgets-ts/angular_jqxbuttons';
import { jqxWindowComponent } from 'jqwidgets-framework/jqwidgets-ts/angular_jqxwindow';
declare var $: any;
@Component({
selector: 'app-users',
templateUrl: './users.component.html',
styleUrls: ['./users.component.scss'],
animations: [routerTransition()]
})
export class UsersComponent implements AfterViewInit {
@ViewChild('myGrid') myGrid: jqxGridComponent;
@ViewChild('myDropDownList') myDropDownList: jqxDropDownListComponent;
@ViewChild('myInput') myInput: jqxInputComponent;
@ViewChild('myWindow') myWindow: jqxWindowComponent;
ngAfterViewInit(): void {
this.createButtons();
}
dropDownSource: string[] = ['First Name', 'Last Name', 'Product', 'Quantity', 'Price'];
getAdapter = (): any => {
let source: any =
{
url: '/api/users',
datatype: 'array',
datafields: [
{ name: 'login', type: 'string' },
{ name: 'firstName', type: 'string' },
{ name: 'lastName', type: 'string' },
{ name: 'email', type: 'string' },
{ name: 'langKey', type: 'string' },
{ name: 'createdBy', type: 'string' }
],
updaterow: (rowid: number, rowdata: any, commit: any): void => {
// synchronize with the server - send update command
// call commit with parameter true if the synchronization with the server is successful
// and with parameter false if the synchronization failed.
commit(true);
}
};
let dataAdapter: any = new jqx.dataAdapter(source);
return dataAdapter;
}
dataAdapter = this.getAdapter()
columns:
[
{ text: '登录名', datafield: 'login', width: 190 },
{ text: '名字', datafield: 'firstName', width: 190 },
{ text: '姓氏', datafield: 'lastName', width: 180 },
{ text: '邮件', datafield: 'email', width: 120 },
{ text: '语言', datafield: 'langKey', width: 120 },
{ text: '最近修改人', datafield: 'createdBy', minwidth: 120 }
];
......
}
2017年08月16日 07点08分
3
level 2
user.module.ts:
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { BrowserModule } from '@angular/platform-browser';
import { UsersComponent } from './users.component';
import { UsersRoutingModule } from './users-routing.module';
import { PageHeaderModule } from './../../shared';
import { TablesModule } from '../tables/tables.module';
import { FormsModule } from '@angular/forms';
import { GridModule } from '../../modules/grid.module';
import { ButtonModule } from '../../modules/button.module';
import { DropDownListModule } from '../../modules/dropdownlist.module';
import { InputModule } from '../../modules/input.module';
import { WindowModule } from '../../modules/window.module';
@NgModule({
imports: [
CommonModule,
UsersRoutingModule,
BrowserModule,
PageHeaderModule,
TablesModule,
FormsModule,
GridModule,
ButtonModule,
DropDownListModule,
InputModule,
WindowModule
],
declarations: [UsersComponent ]
})
export class UsersModule { }
2017年08月16日 07点08分
5