Question

我的Service方法中有一个switch case语句

myservice.ts

mapGridData(data) {
let colDefObj: GridColumnDef;
const colDefArray = [];
const idToNameMap = {};
let gridDataArray = [];
let aDT: any;
data.attributeMetaData.forEach(subItem => {
  if (subItem.isHidden !== 'true') {
    switch (subItem.attributeDataType) {
      case 'INTEGER':
        aDT = 'numeric';
        break;
      case 'STRING':
        aDT = 'text';
        break;
      case 'DATE':
        aDT = 'date';
        break;
    }
    idToNameMap[subItem.attributeId] = subItem.attributeName;
    colDefObj = new GridColumnDef(subItem);
    colDefArray.push(colDefObj);
  }
});
if (data.attributeValues === null) { data.attributeValues = []; }
gridDataArray = data.attributeValues.map(attributeObj => {
  const row = { objectId: attributeObj.objectId };
  attributeObj.attributeList.forEach(attr => {
    row[idToNameMap[attr.attributeId]] = attr.attributeValue;
  });
  return row;
});
return { gridDataArr: gridDataArray, colDefArr: colDefArray };
}

我正在以下多个组件中使用此服务

mycomponent.ts

const gridDataObj = this.gridService.mapGridData(data);

在我的组件html文件中，我需要像下面那样绑定aDT值

<kendo-grid-column *ngFor="let column of gridColDef" [filterable]="column.isFilterable === 'true' ? true : false" [sortable]="column.isSortable === 'true' ? true : false" [locked]="false" filter="{{aDT}}">

那么，如何将服务值绑定到组件模板中？请提出建议。谢谢。

Answer 1

如何在组件模板中绑定服务值？请提出建议。

要将某些内容与let绑定，您需要组件级别的变量（而不是组件功能内的变量，例如const，var，{{aDT}}）

在模板中，您使用的是public aDT，即不是任何对象的一部分，而只是普通变量，而不是应在组件中声明的变量，即aDT，并在从服务接收数据时分配一个值。

要考虑的要点：

您没有为@Michael D在注释中指出的服务中的任何对象分配任何gridDataArray值，您只是声明了一个变量，并且每次迭代都为其分配了一个新值。
您正在通过服务colDefArray或<kendo-grid-column *ngFor="let column of gridColDef" [filterable]="column.isFilterable === 'true' ? true : false" [sortable]="column.isSortable === 'true' ? true : false" [locked]="false" [filter]="column.aDT">返回对象。根据您的要求，如果您要渲染类似

colDefObj

然后它应该是service对象的一部分。

不推荐的方式。在您的. . let gridDataArray = []; let aDT: any; let aDTArray = []; // declare a variable that holds all the values . . . colDefObj = new GridColumnDef(subItem); colDefArray.push(colDefObj); aDTArray.push(aDT); // push your values here . . . . return { gridDataArr: gridDataArray, colDefArr: colDefArray, aDT: aDTArray }; // return it here

component.ts

和public aDT: any[]; public gridDataObj: any ; const gridDataObj = this.gridService.mapGridData(data); this.adT = gridDataObj.adtArray ; this.gridColDef = gridDataObj.colDefArr ;

中

template

和<kendo-grid-column *ngFor="let column of gridColDef; let i = index" [filterable]="column.isFilterable === 'true' ? true : false" [sortable]="column.isSortable === 'true' ? true : false" [locked]="false" [filter]="aDT[i]"> 

中

aDT

如果在某处有帮助，则应重新访问并检查服务，以了解如何根据需要返回template。

P.S。

在filter中使用filter={{aDT}}，而不要进行[filter]="aDT"，您应该使用PUT abc-students-log { "mappings": { "properties": { "Data": { "type": "object", "properties": { "PASSED": { "type": "text" } } }, "insertion_timestamp": { "type": "date", "format": "epoch_second" } } } }

将值从服务传递到组件或将服务传递到模板

1 个答案: