[英]Angular 6 Docker Build - ERROR in The Angular Compiler requires TypeScript >=2.7.2 and <2.8.0 but 2.8.3 was found instead
[英]Typescript 2.7.2: Trouble reading this error message
我想知道如何解決此打字問題。 我需要創建一個滿足以下錯誤的接口,但我不明白此錯誤消息試圖告訴我什么。
錯誤:
類型'((obj:Object)=> boolean')的參數不能分配給類型'((value:Object,index:number,array:Object [])=> value is any'的參數。 簽名'((obj:Object):boolean')必須是類型謂詞。
部分解決問題后,我得到了一個新錯誤:
類型“對象”上不存在“已檢查”屬性。
將“ Object []”替換為“ any []”后,上述錯誤已解決。 那里有打字稿,以防止將來出現問題,使用“ any”被認為是不好的做法。 那么,如何為“ searchResult”建立適當的接口?
打字稿包:
"ts-node": "~5.0.1",
"tslint": "~5.9.1",
"typescript": "~2.7.2"
零件:
import { OrgUserResponseInterface } from './../../../shared/models/org-user-response.model';
import { CustomCheckboxComponent } from './../custom-checkbox/custom-checkbox.component';
import { Component, Input, OnInit, ViewChild, Output, EventEmitter } from '@angular/core';
import {
Grid,
SelectionSettingsModel,
ContextMenuItem,
DataSourceChangedEventArgs,
DataStateChangeEventArgs,
FilterSettingsModel,
EditSettingsModel,
PageSettingsModel
} from '@syncfusion/ej2-grids';
import { Observable } from 'rxjs/internal/Observable';
import { OrgAdminsService } from '../../../shared/services/OrgAdminsService.model';
import { SecService } from '../../../shared/services/Sec.service';
import { SupService } from '../../../shared/services/Sup.service';
import { UserService } from "./../../../shared/services/UserManagement/User.service";
import { OrgService } from "./../../../shared/services/OrgManagement/Org.service";
interface clickObj {
id: string;
}
@Component({
selector: 'sf-data-table',
templateUrl: './sf-data-table.component.html',
styleUrls: ['./sf-data-table.component.css']
})
export class SfDataTableComponent implements OnInit {
public data: Observable<DataStateChangeEventArgs>;
public pageOptions: Object;
public editSettings: EditSettingsModel;
// public pageSettings: PageSettingsModel;
public pageSettings: Object;
public toolbar: string[];
public state: DataStateChangeEventArgs;
public dataList: Object[] = [];
// TODO: make interface for the users object
// public users: OrgUserResponseInterface;
// public resizeSettings = { resizeMode: ej.Grid.ResizeMode.Control };
public filterSettings: FilterSettingsModel;
public contextMenuItems: ContextMenuItem[];
// public grid: GridComponent;
public errorMessage = "";
public textWrapSettings;
public selectionSettings: SelectionSettingsModel;
public rowIsChecked: boolean;
@Input('filter') filter: any;
// 1. In child we create a click event variable with the Output decorator and set it equal to a new event emitter
public clickObject: any;
@Output() clickObjectEvent = new EventEmitter();
@ViewChild('grid') grid: Grid;
@Input('usingService') usingService: string; // this gets an indication from the parent component hosting this data-table and displays the service/data that component needs displayed
currentService: any; /// this is going to contain the service we will use in each instance of the sf data table component which depends on usingService from its parent component
//! temp removed put back after api functions are restored to WebApiService. Currently use DataServbice
//!
constructor(private _supService: SupService, private _secService: SecService, private _orgAdminsService: OrgAdminsService, private _userService: UserService, private _orgService: OrgService) {
// this.data = this.currentService; //this is where we bring in the data?
this.textWrapSettings = { wrapMode: "header" };
}
// 2. Then we create a function sendObject that calls emit on this object with the message we want to send
sendClickObject(args) {
this.clickObject = this.grid.getRowInfo(args.target)
this.clickObjectEvent.emit(this.clickObject)
console.log(this.dataList);
if (this.clickObject.target.className === "custom-checkbox" || "custom-checkbox-checked") {
this.getCurrentServiceObjectFromClick();
}
}
getCurrentServiceObjectFromClick() {
var searchResult = this.dataList.filter<any>((obj:clickObj) => {
return obj.id === this.clickObject.rowData.id;
})
if (searchResult[0].checked === undefined) {
searchResult[0].checked = true;
console.log('checked')
} else {
searchResult[0].checked = !searchResult[0].checked;
}
console.log(searchResult);
}
onClick(args) {
console.log(this.grid.getRowInfo(args.target))
}
ngOnInit(): void {
if (this.usingService === 'userServiceTable') {
this.currentService = this._userService;
} else if (this.usingService === 'orgServiceTable') {
this.currentService = this._orgService;
console.debug("OrgServiceTable: " + this.currentService);
} else if (this.usingService === 'supServiceTable') {
this.currentService = this._supService;
} else if (this.usingService === 'secServiceTable') {
this.currentService = this._secService;
} else if (this.usingService === 'orgAdminsServiceTable') {
this.currentService = this._orgAdminsService;
}
this.getGridData(); // step 1: call component method
const state = { skip: 0, take: 7 };
this.currentService.execute(state); // step 4: component initiates call to service method execute
// this.toolbar = ['Add', 'Edit', 'Delete', 'Update', 'Cancel', 'Search']; // step 7: toolbar is setup
this.toolbar = ['Search']; // step 7: toolbar is setup
this.selectionSettings = { type: 'Multiple' };
this.editSettings = { //step 8: settings are setup
allowEditing: true,
allowDeleting: true,
allowAdding: true,
mode: 'Dialog',
showDeleteConfirmDialog: true
};
this.filterSettings = { type: "Menu" }; // step 9: filter settings are setup
this.contextMenuItems = ['AutoFit', 'AutoFitAll', 'SortAscending', 'SortDescending', ///step 10: context menus are setup
'Copy', 'Edit', 'Delete', 'Save', 'Cancel',
'PdfExport', 'ExcelExport', 'CsvExport', 'FirstPage', 'PrevPage',
'LastPage', 'NextPage', 'Group', 'Ungroup'];
}
getGridData(): void {
this.currentService.getAll() // step 2: call the service method on the component and subscribe
.subscribe((response) => { this.dataList = response; console.log(this.dataList) },
(error) => { this.errorMessage = error.Message; });
// this.currentService.getAllUsers() // step 2: call the service method on the component and subscribe
// .subscribe((response) => { this.users = response; console.log(this.users) },
// (error) => { this.errorMessage = error.Message; });
}
public dataStateChange(state: DataStateChangeEventArgs): void {
this.currentService.execute(state); // for binding the data.
}
public dataSourceChanged(state: DataSourceChangedEventArgs): void {
if (state.action === 'add') {
this.currentService.addUser(state).subscribe(() => state.endEdit());
} else if (state.action === 'edit') {
this.currentService.updateUser(state).subscribe(() => state.endEdit());
} else if (state.requestType === 'delete') {
this.currentService.deleteUser(state).subscribe(() => state.endEdit());
}
}
}
上下文:該組件用於顯示網格。 當前引發錯誤的函數用於捕獲click事件,按id過濾並向行對象數據添加一個check = true鍵值。 該對象將與下游帶有行為主題的對象同步。
嘗試刪除any
filter
功能類型。
var searchResult = this.dataList.filter((obj:clickObj) => {
return obj.id === this.clickObject.rowData.id;
})
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.