У меня есть приложение колба, которая возвращает вывод из функции jsonify, но вывод, который отображается в HTML не очень красиво. Я теперь, чтобы проанализировать этот вывод и изменить его, прежде чем вернуть его в HTML. Я попытался перебрать вывод json, но это не позволило мне сделать это. Как я могу это сделать?

Сначала вот вывод из функции jsonify на моей веб-странице

Прогноз: яблочная ржавчина кедра, 99,6459424495697, здоровый Bell_Pepper, 0,2868120325729251, здоровая черника, 0,05757397739216685

Я хочу что то подобное

Предсказания :

Яблочно-кедровая ржавчина: 99.6459424495697

Bell_Pepper здоров: 0,2868120325729251

Черника здоровая: 0,05757397739216685

Теперь вот код для того же самого в моем файле app.py

@app.route('/predict', methods=['GET', 'POST']) def upload(): if request.method == 'POST': # Get the file from post request f = request.files['file'] # Save the file to ./uploads basepath = os.path.dirname(__file__) file_path = os.path.join( basepath, 'uploads', secure_filename(f.filename)) f.save(file_path) result = model_predict(file_path, model) return jsonify(result) return None 

Наконец, вот код для моего файла main.js

 $.ajax({ type: 'POST', url: '/predict', data: form_data, contentType: false, cache: false, processData: false, async: true, success: function (data) { // Get and display the result $('.loader').hide(); $('#result').fadeIn(600); $('#result').text(' Prediction: '   data); console.log('Success!'); }, }); 

Вы можете вернуть строку HTML, которая может быть использована в качестве тела div #result :

В вашем app.py , в upload :

 ... result = model_predict(file_path, model) return flask.jsonify({'html':'n'.join(f'{amp}lt;p{amp}gt;{a}: {b}{amp}lt;/p{amp}gt;' for a, b in result)}) 

В main.js :

 $.ajax({ type: 'POST', url: '/predict', data: form_data, contentType: false, cache: false, processData: false, async: true, success: function (data) { // Get and display the result $('.loader').hide(); $('#result').fadeIn(600); $('#result').append(data.html); //add previously formatted html to div console.log('Success!'); }, }); 

Javascript рендеринг значений:

В app.py :

 import json result = model_predict(file_path, model) return flask.jsonify({'payload':json.dumps([{'name':a, 'val':b} for a, b in result])}) 

В main.js :

 $.ajax({ type: 'POST', url: '/predict', data: form_data, contentType: false, cache: false, processData: false, async: true, success: function (data) { // Get and display the result $('.loader').hide(); $('#result').fadeIn(600); var new_data = JSON.parse(data.payload); $('#result').append('Prediction: '); for (var i in new_data){ var _html = ` {amp}lt;p{amp}gt;${new_data[i].name}: ${new_data[i].val}{amp}lt;/p{amp}gt; ` $('#result').append(_html); } console.log('Success!'); }, }); 

Предполагая, что result является действительный объект json, переданный в jasonify(result) , вам нужно будет выполнить итерацию по объекту данных в вашем main.js и программно отобразить пары key:value . Что-то вроде этого:

 // data = { 'Apple Cedar rust': '99.6459424495697', ... } $.each(data,function(key,value){ $('#results-list').append("{amp}lt;span{amp}gt;"  key  ": "   value   "{amp}lt;/span{amp}gt;") });