Here's a Flask application that showcases a list of objects.
from flask import *
app = Flask(__name__)
class Entry:
def __init__(self, name, surname):
self.name = name
self.surname = surname
entries = []
entries.append(Entry('Paul', 'McCartney'))
entries.append(Entry('John', 'Lennon'))
entries.append(Entry('George', 'Harrison'))
entries.append(Entry('Ringo', 'Starr'))
@app.route('/')
def index():
return render_template('index.html', entries = entries)
if __name__ == '__main__':
app.run(debug=True)
Below is the content of the index.html file:
<html>
<head>
</head>
<body>
<script>
var entryName = "{{entries[0].name}}"
console.log(entryName)
</script>
</body>
</html>
When running this code as presented, the console outputs Paul as expected.
However, if you modify the code as follows:
var allEntries = "{{entries}}"
console.log(allEntries[0].name)
The console will display undefined
If you simply output console.log(allEntries), it will show:
[<__main__.Entry object at 0x1065a2278>, <__main__.Entry object at 0x1065a22b0>,
<__main__.Entry object at 0x1065a22e8>, <__main__.Entry object at 0x1065a2208>]
To properly handle this list of objects in JavaScript format, some conversion might be required. Any suggestions on how to achieve this? Thank you!