Rendering JSON-Ausgabe auf Flask Bootstrap Seite

Question

Ich versuche, JSON-Datei von Flask in meine HTML-Seite anzuzeigen.

Flask

@app.route("/analysis") 
def analysis(): 
    data = pd.read_csv('static/uploads/' + global_file.filename) 
    temp_json = data.to_json(orient='records') 
    json_df = json.loads(temp_json) 
    list = json_df 
    return render_template('results.html', summary = json.dumps(list)) 

HTML

<div class="results"> 
    <table> 
     {% for key in summary %} 
      {{ key.Name }} 
     {% endfor %} 
    </table> 
    </div> 

JSON

Name Age Class Marks 
A  12  6 32 
B  13  6 32 
C  14  6 43 
D  12  6 54 
E  13  6 23 

Ich erhalte leere Seite als ouptut. Ich möchte es als einen hübschen Tisch auf der Seite anzeigen.

Answer 1

Ich glaube, Sie Werte umwandeln kann und dann Schleife für Tisch-Wörterbuch:

@app.route("/analysis") 
def analysis(): 
    data = pd.read_csv('static/uploads/' + global_file.filename) 
    temp_dict = data.to_dict(orient='records') 
    return render_template('results.html', summary = temp_dict) 

---

<table> 
    {% for value in summary %} 
    <tr> 
     <td> {{ value['Name'] }} </td> 
     <td> {{ value['Age'] }} </td> 
     <td> {{ value['Class'] }} </td> 
     <td> {{ value['Marks'] }} </td>  
    </tr> 
    {% endfor %} 
</table> 

Answer 2

Der Grund dafür ist, Sie das JSON-Objekt in einen String konvertieren mit json.dumps Dazu iterieren durch die Zeichenfolge (Zeichen für Zeichen) und versuchen, auf Name Attribut zuzugreifen. Wenn Sie die .Name weglassen, sehen Sie in der Tat jedes Zeichen, das nacheinander ausgedruckt wird.

Um dies zu beheben, sollten Sie die Vorlage mit dem tatsächlichen Objekt bereitstellen: a list von dicts. Wie so:

@app.route("/analysis") 
def analysis(): 
    data = pd.read_csv('static/uploads/' + global_file.filename) 
    temp_json = data.to_json(orient='records') 
    json_df = json.loads(temp_json) 
    return render_template('results.html', summary = json_df) 

Dann noch wird es nicht eine tatsächliche Tabelle, weil in der Vorlage keine tr oder td Elemente sind. Wenn Sie das beheben:

<div class="results"> 
    <table> 
     {% for item in summary %} 
      <tr><td> 
      {{ item['Name'] }} 
      </td></tr> 
     {% endfor %} 
    </table> 
</div> 

Sie werden eine tatsächliche Tabelle sehen.

EDIT: Auch die Konvertierungen innerhalb Ihrer Analyse-Methode sind ein bisschen überflüssig, aber vielleicht haben Sie Ihren Code gekürzt, um hier zu posten?