如何在网格中以角度动态绑定数据

时间:2017-07-11 12:39:48

标签: angularjs

如何以角度

在网格中动态绑定数据

我在使用web api为角度准备动态网格时遇到问题。我正在准备从数据库表和csv表体中的表标题。在表标题表中,我有每个字段的数据类型。

如何绑定

        .csv
        ========
        ADescription,AProdName,BarCode,BaseUnit,CategoryID,Description,IsNonInv,PCode,ProdName,Status
        arabic RRM Product 001 Description,Arabic RRM Product 001,Product Wise BarCode,Nos,Products Category,RRM Product 001 Description,Spares,,RRM Product 001,Active
        arabic RRM Product 001 Description,Arabic RRM Product 001,Product Wise BarCode,Nos,Products Category,RRM Product 001 Description,Spares,,RRM Product 001,Active

        Header Table
        =============
            ColumnName  DataType Mandatory Hidden ReadOnly ColSeq

        51  ADescription    text        0   0   0
        51  AProdName   text        0   0   0
        51  BarCode text    0       0   0
        51  BaseUnit    int     1   0   0
        51  CategoryID  int     1   0   0
        51  Description text        0   0   0
        51  IsNonInv    int     0   0   0
        51  PCode   text    0       0   0
        51  ProdName    text        1   0   0
        51  Status  int 0       0   0


  in table heading
======================
  

在ng-repeater = DataSetHeader中导入并绑定import.ColumnName

in table body
================
  

in tr ng-repeat =数据集中的网格以及DataSetHeader中的td ng-repeat = import。

puttype中的

应来自import.DataType并绑定数据

1 个答案:

答案 0 :(得分:0)

这不是您的第一次,您可以将.csv转换为JSON。

以下是一个例子:

//var csv is the CSV file with headers
function csvJSON(csv){

  var lines=csv.split("\n");

  var result = [];

  var headers=lines[0].split(",");

  for(var i=1;i<lines.length;i++){

      var obj = {};
      var currentline=lines[i].split(",");

      for(var j=0;j<headers.length;j++){
          obj[headers[j]] = currentline[j];
      }

      result.push(obj);

  }

  //return result; //JavaScript object
  return JSON.stringify(result); //JSON
}

稍后您可以使用angularjs ng-repeat来执行此操作。

角度1:

<div ng-repeat="(key, value) in myObj"> ... </div>

价值是你的json ......

参考1:http://techslides.com/convert-csv-to-json-in-javascript

参考2:https://code.angularjs.org/1.6.5/docs/api/ng/directive/ngRepeat