Zugriff auf Datenbindungen durch Klammern statt Punkt (.) Operator

Question

eine Vorlage Repeater haben, die bei mir läuft, und Daten, die von dem Punkt-Operator zeigt

<template as="dom-repeat" items="{{list}}" as="row" index-as="rowIndex" 
    <div>{{row.foo}}</div> 
    <div>{{row.bar}}</div> 
</template 

ich durch Klammern um das Element zu bekommen versuchte

<div>row["foo"]</div> 
    <div>row['bar']</div> 

aber diese funktionieren nicht, aber gibt es eine Möglichkeit, damit es funktioniert? Ich versuche, diese Liste basierend auf einigen Objektmetadaten dynamisch zu machen und verallgemeinere sie. So kann ich so etwas wie laufen konnte:

<div>{{row[getKey(rowIndex)]}}</div> 

Edit:

ich das sah: https://github.com/Polymer/polymer/issues/1504, die besagt, dass dies nun in Polymer erlaubt ist 0,5, aber es ist ein experimenteller Zweig in 1.0 genannt: Polymer Expressions bei https://github.com/Polymer/polymer-expressions/tree/2.0-preview was zeigt, dass es möglich ist.

Das Problem ist, dass dies experimentell ist, daher möchte ich dies nicht zu meiner Produktion DartPolymer1.0 Codebasis hinzufügen.

Ich denke, mit dem, sagte, gibt es Workarounds dafür? Ich denke, ich könnte versuchen, etwas mit der Umwandlung von Objekten in Arrays für den Zugriff zu tun und dann nur einen direkten Zugriff zu tun.

Wird eine Follow-on-Antwort veröffentlichen, wenn ich es herausfinden kann.

Answer 1

Dies ist die Antwort, die ich mit gekommen war:

mit dem Dart-Code von

<style> 
    .table{ 
     display:table; 
    } 
    .row{ 
     display:table-row; 
    } 
    .cell{ 
     display:table-cell; 
    } 

    .th{ 
     display:table-cell; 
     font-weight: bold; 
    } 
    .table, .row, .cell, .th { 
     border: solid 1px black; 
     padding: 5px; 
    } 
</style> 
<div class="table"> 
    <div id="headerRow" class="row"> 
     <template is="dom-repeat" items="{{columnHeaders}}"> 
      <template is="dom-repeat" items="{{convertMap(item)}}" as="prop"> 
       <div class="th">{{prop.value}}</div> 
      </template> 
     </template> 
    </div> 
    <template id="myRepeat" is="dom-repeat" items="{{data}}" as="row"> 
     <div class="row"> 
      <template is="dom-repeat" items="{{getListByFilter(row)}}" as="prop"> 
       <div class="cell">{{prop.value}}</div> 
      </template> 
     </div> 
    </template> 
</div> 

:

@property 
List<Map> columnHeaders = []; 
@property 
List<Map> data = []; 

@reflectable 
List<Map> convertMap(Map map, [__]){ 
    List<Map> lst = map.keys.map((key)=> { "name": key, "value": map[key]}).toList(); 
    return lst; 
} 

@reflectable 
List<Map> getListByFilter(Map row) { 
    List<Map> headers = new List<Map>(); 
    columnHeaders.forEach((Map ele) => headers.add(convertMap(ele)[0])); 

    List<Map> rowList = new List<Map>(); 

    for (Map header in headers) { 
     print("in for loop"); 
     Map node = new Map(); 
     node["name"] = header["name"]; 
     node["value"] = row[header["name"]]; 
     rowList.add(node); 
    } 
    List keysToIgnore = rowList.map((Map element) => element["name"]).toList(); 

    for (String key in row.keys) { 
     if (!keysToIgnore.contains(key)) { 
     Map node = new Map(); 
     node["name"] = key; 
     node["value"] = row[key]; 
     rowList.add(node); 
     } 
    } 
    return rowList.sublist(0, columnHeaders.length); 
} 

daher, wenn dieses Element zu definieren:

<myDataGrid data="{{testrows}}" columnheaders="{{headers}}"></myDataGrid> 

wo die Dart Objekte werden in der Idee gebildet:

List<Map> headers = [{"columnKey":"ColumnTextString"},....]; 
List<Map> testRows = [{"columnKey": data, "anotherColumnKey": dataB}]; 

wobei die in den Zeilenobjekten sein muss .... und die Kopfzeilenschlüssel sind eine Teilmenge der Zeilenobjekte. Daher wird eine Reihenfolge von Spalten festgelegt und diese als Referenzierungsfaktor für die Zeilendaten verwendet.

Es wird beibehalten, dass jede Zeile weiterhin Zugriff auf den vollständigen Satz von Daten für andere Mittel hat, aber nur anzeigen wird, was gerade in den Headern eingerichtet ist.

Dies geht ziemlich gut um die Klammer Operator.