Как передать данные для таблицы из Python flask render_template в AngularJS контроллер

Question

Я следовал приведенному ниже руководству и создал успешную страницу html для отображения таблицы. Однако я хочу интегрировать файл html с моим приложением Python Flask, чтобы отобразить html с табличными данными. Я попробовал приведенный ниже код, но он не работает.

http://embed.plnkr.co/w39Xt74pippDajyqUIOD/preview

<script>
  angular.module('myApp', ['trNgGrid'])
  .controller("MainCtrl", ["$scope", function ($scope) {

     $scope.myItems = [
        {% for data in datas %}
        {
            {% for key, value in data.items() %}
                {% if value is string %}
                    '{{ key }}': '{{ value }}',
                {% else %}
                    '{{ key }}': {{ value }},
                {% endif %}
            {% endfor %}
        },
        {% endfor %}
    ];

}]);
</script>

rout.py

@app.route('/page')
def jumping():
    df = pd.read_csv(REPORT_CSV)
    arr = [row for row in df.to_dict(orient='records')]
    return render_template('page.html', datas=arr)

Я попробовал много, но застрял здесь. Отчаянно нужно какое-то решение. Заранее спасибо.

Answer 1

Отрисовать данные из flask объектов Jinja довольно сложно, тогда он будет инициализирован в AngularJS контроллере. У меня есть лучший и простой подход, чем этот.

from flask import jsonify, render_template

@app.route('/page')
def jumping():
    return  render_template('index.html')

@app.route('/page/list-records')
def list_records():
    df = pd.read_csv(REPORT_CSV)
    arr = [row for row in df.to_dict(orient='records')]
    return  jsonify({'datas'=arr})

Вам нужно что-то изменить в контроллере AngularJS, следующий код даст вам больше информации о реализации.

angular
.module('myApp', ['trNgGrid'])
.controller("MainCtrl", ["$scope", "$http" function ($scope, $http) {
    $scope.myItems = [];
    $http.get('/page/list-records').then(function (resp) {
         $scope.myItems = resp.data.datas;
    }
}]);