Is there anything in Jinja that would allow me to select only the data from an array without the `['']`

Question:

I have got a for loop set up in Jinja, that for loop iterates through a list of items eg: ['abc', 'def']

Now when I try and use those by eg: {{ [i]["letters"] }}

Jinja counts the [''] eg: Gives me back: [‘abc’] too, which I dont want..

Now how do I get rid of those ['']

This is my for loop bit:

                    {% for movie in movies%}
                        <div class="grid-container">
                            <div class="grid-item">
                                <div class="card mb-3" style="max-width: 540px;">
                                    <div class="row g-0">
                                        <div class="col-md-4">
                                            <img src={{ [movie]["poster_path"] }} class="img-fluid rounded-start" alt="..." style="width: 100%; height: 100%;">
                                        </div>
                                        <div class="col-md-8">
                                            <div class="card-body">
                                                <h5 class="card-title">{{ [movie]["title"] }}</h5>
                                                <p class="card-text" style="font-size: 14px;">{{ [movie]["overview"] }}</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    {% endfor %}

Movies contains:

[{'adult': False, 
  'backdrop_path': '/7RyHsO4yDXtBv1zUU3mTpHeQ0d5.jpg', 
  'genre_ids': [12, 878, 28], 
  'id': 299534, 
  'original_language': 'en', 
  'original_title': 'Avengers: Endgame', 
  'overview': "After the devastating events of Avengers: Infinity War, 
  the universe is in ruins due to the efforts of the Mad Titan, 
  Thanos. With the help of remaining allies, 
  the Avengers must assemble once more in order to undo Thanos' actions and restore order to the universe once and for all, 
  no matter what consequences may be in store.", 
  'popularity': 262.372, 
  'poster_path': '/or06FN3Dka5tukK1e9sl16pB3iy.jpg', 
  'release_date': '2019-04-24', 
  'title': 'Avengers: Endgame', 
  'video': False, 
  'vote_average': 8.3, 
  'vote_count': 21417}, 
  
 {'adult': False, 
  'backdrop_path': '/lmZFxXgJE3vgrciwuDib0N8CfQo.jpg', 
  'genre_ids': [12, 28, 878], 
  'id': 299536, 
  'original_language': 'en', 
  'original_title': 'Avengers: Infinity War', 
  'overview': 'As the Avengers and their allies have continued to protect the world from threats too large for any one hero to handle, 
  a new danger has emerged from the cosmic shadows: Thanos. A despot of intergalactic infamy, 
  his goal is to collect all six Infinity Stones, 
  artifacts of unimaginable power, 
  and use them to inflict his twisted will on all of reality. Everything the Avengers have fought for has led up to this moment - the fate of Earth and existence itself has never been more uncertain.', 
  'popularity': 403.216, 
  'poster_path': '/7WsyChQLEftFiDOVTGkv3hFpyyt.jpg', 
  'release_date': '2018-04-25', 
  'title': 'Avengers: Infinity War', 
  'video': False, 
  'vote_average': 8.3, 
  'vote_count': 24988}, 
  
 {'adult': False, 
  'backdrop_path': '/nNmJRkg8wWnRmzQDe2FwKbPIsJV.jpg', 
  'genre_ids': [878, 28, 12], 
  'id': 24428, 
  'original_language': 'en', 
  'original_title': 'The Avengers', 
  'overview': 'When an unexpected enemy emerges and threatens global safety and security, 
  Nick Fury, 
  director of the international peacekeeping agency known as S.H.I.E.L.D., 
  finds himself in need of a team to pull the world back from the brink of disaster. Spanning the globe, 
  a daring recruitment effort begins!', 
  'popularity': 257.529, 
  'poster_path': '/RYMX2wcKCBAr24UyPD7xwmjaTn.jpg', 
  'release_date': '2012-04-25', 
  'title': 'The Avengers', 
  'video': False, 
  'vote_average': 7.7, 
  'vote_count': 27221}, 
  
 {'adult': False, 
  'backdrop_path': '/xnqust9Li4oxfhXD5kcPi3UC8i4.jpg', 
  'genre_ids': [28, 12, 878], 
  'id': 99861, 
  'original_language': 'en', 
  'original_title': 'Avengers: Age of Ultron', 
  'overview': 'When Tony Stark tries to jumpstart a dormant peacekeeping program, 
  things go awry and Earth’s Mightiest Heroes are put to the ultimate test as the fate of the planet hangs in the balance. As the villainous Ultron emerges, 
  it is up to The Avengers to stop him from enacting his terrible plans, 
  and soon uneasy alliances and unexpected action pave the way for an epic and unique global adventure.', 
  'popularity': 218.3, 
  'poster_path': '/4ssDuvEDkSArWEdyBl2X5EHvYKU.jpg', 
  'release_date': '2015-04-22', 
  'title': 'Avengers: Age of Ultron', 
  'video': False, 
  'vote_average': 7.3, 
  'vote_count': 20089}, 
  
 {'adult': False, 
  'backdrop_path': '/qzzAt0GakCZzbCeCJ0sFGhMIcdv.jpg', 
  'genre_ids': [28, 14], 
  'id': 323660, 
  'original_language': 'en', 
  'original_title': 'Avengers Grimm', 
  'overview': 'When Rumpelstiltskin destroys the Magic Mirror and escapes to the modern world, 
  the four princesses of "Once Upon a Time"-Cinderella, 
  Sleeping Beauty, 
  Snow White, 
  and Rapunzel-are sucked through the portal too. Well-trained and endowed with magical powers, 
  the four women must fight Rumpelstiltskin and his army of 
      thralls before he enslaves everyone on Earth.', 
  'popularity': 42.74, 
  'poster_path': '/1SbBKCbnULACOqWKN7eLfTu1gVm.jpg', 
  'release_date': '2015-03-17', 
  'title': 'Avengers Grimm', 
  'video': False, 
  'vote_average': 4, 
  'vote_count': 99}, 
 {'adult': False, 
  'backdrop_path': '/sORO7a1cSghfWE5GD4cSJ0qTN8O.jpg', 
  'genre_ids': [28, 12, 14], 
  'id': 521720, 
  'original_language': 'en', 
  'original_title': 'Avengers Grimm: Time Wars', 
  'overview': 'When Rumpelstiltskin tries to take over Earth once and for all, 
  The Avengers Grimm must track him down through time in 
      order to defeat him.', 
  'popularity': 39.196, 
  'poster_path': '/xfAcu74DRQXeM9XqFcE5MrSRzYP.jpg', 
  'release_date': '2018-05-01', 
  'title': 'Avengers Grimm: Time Wars', 
  'video': False, 
  'vote_average': 4.9, 
  'vote_count': 46}, 
 {'adult': False, 
  'backdrop_path': '/fryen9fnjlm0YibKTDNGzWNBOSo.jpg', 
  'genre_ids': [53, 878], 
  'id': 9320, 
  'original_language': 'en', 
  'original_title': 'The Avengers', 
  'overview': 'British Ministry agent John Steed, 
  under direction from "Mother", 
  investigates a diabolical plot by arch-villain Sir August de Wynter to rule the world with his weather control machine. Steed investigates the beautiful Doctor Mrs. Emma Peel, 
  the only suspect, 
  but simultaneously falls for her and joins forces with her to combat Sir August.', 
  'popularity': 25.42, 
  'poster_path': '/1p5thyQ4pCy876HpdvFARqJ62N9.jpg', 
  'release_date': '1998-08-13', 
  'title': 'The Avengers', 
  'video': False, 
  'vote_average': 4.4, 
  'vote_count': 572}, 
 {'adult': False, 
  'backdrop_path': '/gCzHEi6g8K0LIWlr6A38fmgtEfb.jpg', 
  'genre_ids': [16, 10751, 28, 12, 878], 
  'id': 14613, 
  'original_language': 'en', 
  'original_title': 'Next Avengers: Heroes of Tomorrow', 
  'overview': "The children of the Avengers hone their powers and go head to head with the very enemy responsible for their parents' demise.", 
  'popularity': 33.607, 
  'poster_path': '/nbwvR5cfvxMtvWowIiwazVaaTVz.jpg', 
  'release_date': '2008-09-02', 
  'title': 'Next Avengers: Heroes of Tomorrow', 
  'video': False, 
  'vote_average': 6.9, 
  'vote_count': 201}, 
  
 {'adult': False, 
  'backdrop_path': '/9tjIgkkbajG2zMI4Yk21hpttXv0.jpg', 
  'genre_ids': [28, 16, 10751, 12, 878], 
  'id': 14609, 
  'original_language': 'en', 
  'original_title': 'Ultimate Avengers: The Movie', 
  'overview': 'When a nuclear missile was fired at Washington in 1945, 
  Captain America managed to detonate it in the upper atmosphere. But then he fell miles into the icy depths of the North Atlantic, 
  where he remained lost for over sixty years. But now, 
  with the world facing the very same evil, 
  Captain America must rise again as our last hope for survival.', 
  'popularity': 24.855, 
  'poster_path': '/vd7GyPkDvDDfvcxgWAfkGpKiAkH.jpg', 
  'release_date': '2006-02-21', 
  'title': 'Ultimate Avengers: The Movie', 
  'video': False, 
  'vote_average': 6.8, 
  'vote_count': 279}, 
  
 {'adult': False, 
  'backdrop_path': None, 
  'genre_ids': [35], 
  'id': 347158, 
  'original_language': 'en', 
  'original_title': 'Bikini Avengers', 
  'overview': "When the Jade Empress steals the world's largest diamonds, 
  super heroes Bikini Avenger and Thong Girl must stop her before she uses the gems to build a dangerous sci-fi weapon.", 
  'popularity': 11.289, 
  'poster_path': '/ehTYWuPKwl8sXPX0I6LnvJUDaVl.jpg', 
  'release_date': '2015-02-24', 
  'title': 'Bikini Avengers', 
  'video': False, 
  'vote_average': 5.5, 
  'vote_count': 15}, 
  
 {'adult': False, 
  'backdrop_path': '/zvjBC9guJVw32bZu4ODp6wzJ9Vi.jpg', 
  'genre_ids': [10751, 16], 
  'id': 368304, 
  'original_language': 'en', 
  'original_title': 'LEGO Marvel Super Heroes: Avengers Reassembled!', 
  'overview': 'The Avengers are forced to “party” with Ultron when he seeks to disassemble the team by taking control of Iron Man’s armor and enact a nefarious scheme to take over the world.', 
  
  'popularity': 17.238, 
  'poster_path': '/xUBZNoY7idPfqKZepnDEv7Qc8GC.jpg', 
  'release_date': '2015-11-16', 
  'title': 'LEGO Marvel Super Heroes: Avengers Reassembled!', 
  'video': False, 
  'vote_average': 6.5, 
  'vote_count': 97}, 
  
 {'adult': False, 
  'backdrop_path': '/ldxi7dKtud2KrStUr8V9P65ixNr.jpg', 
  'genre_ids': [12, 16, 28, 878], 
  'id': 14611, 
  'original_language': 'en', 
  'original_title': 'Ultimate Avengers 2: Rise of the Panther', 
  'overview': 'Mysterious Wakanda lies in the darkest heart of Africa, unknown to most of the world. An isolated land hidden behind closed borders, fiercely protected by its young king: Black Panther. But when brutal alien invaders attack, the threat leaves Black Panther with no option but to go against the sacred decrees of his people and ask for help from outsiders.', 
  'popularity': 20.461, 
  'poster_path': '/bsDLG069v8esZkI2owKvduQIrq.jpg', 
  'release_date': '2006-08-08', 
  'title': 'Ultimate Avengers 2: Rise of the Panther', 
  'video': False, 
  'vote_average': 6.7, 
  'vote_count': 230}, 
  
 {'adult': False, 
  'backdrop_path': '/7dxHsaSxrkowFFmg7gInn0l9sh2.jpg', 
  'genre_ids': [35, 14], 
  'id': 538153, 
  'original_language': 'en', 
  'original_title': 'Avengers of Justice: Farce Wars', 
  'overview': 'While trying to remain a good husband and father, 
  Superbat and the Avengers of Justice come out of retirement to stop Dark Jokester and Lisp Luthor from freezing the planet.', 
  'popularity': 13.653, 
  'poster_path': '/yymsCwKPbJIF1xcl2ih8fl7OxAa.jpg', 
  'release_date': '2018-07-20', 
  'title': 'Avengers of Justice: Farce Wars', 
  'video': False, 
  'vote_average': 3.8, 
  'vote_count': 11}, 
  
 {'adult': False, 
  'backdrop_path': '/eQiRPyEWhYnuqEGfoCsCO173oIw.jpg', 
  'genre_ids': [], 
  'id': 448368, 
  'original_language': 'en', 
  'original_title': 'The Avengers: A Visual Journey', 
  'overview': 'Joss Whedon and others in interviews discussing the aims for this new franchise.', 
  'popularity': 11.81, 
  'poster_path': '/2kBT7KONKQTIhkMc2ZtPU11E8Ky.jpg', 
  'release_date': '2012-09-25', 
  'title': 'The Avengers: A Visual Journey', 
  'video': True, 
  'vote_average': 7.8, 
  'vote_count': 12}, 
  
 {'adult': False, 
  'backdrop_path': '/6zXs4OyZM6U4reYvddsJWeByxMX.jpg', 
  'genre_ids': [99], 
  'id': 448366, 
  'original_language': 'en', 
  'original_title': 'Building the Dream: Assembling the Avengers', 
  'overview': "Witness Marvel's epic journey,  from its comic book origins to its blockbuster film franchises, through seven exclusive featurettes. Get the inside story,  with exclusive behind-the-scenes footage and cast interviews,  and discover the history behind its legendary characters and films -- Iron Man, The Incredible Hulk,  Iron Man 2, Thor, Captain America: The First Avenger, and Marvel's The Avengers! With over 90 minutes of original footage, this is your all-access pass to Marvel and Phase One of the Marvel Cinematic Universe!", 
   popularity': 9.189, 
  'poster_path': '/coS6rIaucxDzq20kiJozTgQ0Nmk.jpg', 
  'release_date': '2012-09-25', 
  'title': 'Building the Dream: Assembling the Avengers', 
  'video': True, 
  'vote_average': 8.3, 
  'vote_count': 23}, 
  
 {'adult': False, 
  'backdrop_path': '/fYVwmnRDCGQIpKA0QpzIEkczSes.jpg', 
  'genre_ids': [10751, 16, 28, 12], 
  'id': 940543, 
  'original_language': 'en', 
  'original_title': 'LEGO Marvel Avengers: Time Twisted', 
  'overview': 'When Thanos steals the quantum tunnel, 
  the Avengers embark on a mission to stop him from changing history.', 
  'popularity': 4.802, 
  'poster_path': '/7nA9AjJ8iZvbBPsFPC2FNoFj568.jpg', 
  'release_date': '2022-01-17', 
  'title': 'LEGO Marvel Avengers: Time Twisted', 
  'video': False, 
  'vote_average': 5, 
  'vote_count': 2}, 
 {'adult': False, 
  'backdrop_path': None, 
  'genre_ids': [10751, 16, 28], 
  'id': 899249, 
  'original_language': 'en', 
  'original_title': 'LEGO Marvel Avengers: Loki in Training', 
  'overview': 'Loki declares he wants to be an Avenger, so Iron Man decides to make Loki an "Avenger In Training." It's a great plan until Thanos arrives on Earth looking for Loki.', 
  'popularity': 4.364, 
  'poster_path': '/eyBifMbovoQbyuNXHOFYo7tsInp.jpg', 
  'release_date': '2021-11-01', 
  'title': 'LEGO Marvel Avengers: Loki in Training', 
  'video': False, 
  'vote_average': 6.9, 
  'vote_count': 4}, 
  
 {'adult': False, 
  'backdrop_path': '/boX7D2wHtf01C7AzzPuVZAzc74x.jpg', 
  'genre_ids': [35, 878], 
  'id': 58906, 
  'original_language': 'en', 
  'original_title': 'Alien Avengers', 
  'overview': "Charlie and Rhonda are a sweet and comfortable married couple on vacation with their lovely daughter Daphne. They find a rundown boarding house and its haggard owner, Joseph, an ex-con whose mother has just died and left him the house. He doesn't know why this cheerful couple would want to vacation in the worst part of Los Angeles, but he doesn't know they're vacationing from outer space, and their idea of fun is murdering lowlife out on the streets", 
  'popularity': 1.941, 
  'poster_path': '/Akd3Aqrr2q8PLKOCPOkOnB3AoJk.jpg', 
  'release_date': '1996-08-03', 
  'title': 'Alien Avengers', 
  'video': False, 
  'vote_average': 6, 
  'vote_count': 5}, 
  
 {'adult': False, 
  'backdrop_path': None, 
  'genre_ids': [12], 
  'id': 432413, 
  'original_language': 'en', 
  'original_title': 'The Avengers', 
  'overview': 'The attractive Argentine Don Careless is an adventurer and an excellent swordsman. Don is in love with Maria Moreno, since he had to emerge her jewels and had thereby to kill a shark. Don tries to prevent the forced marriage of Mary with the ruthless revolutionary Colonel Luis Corral. An armed clash between Don and Luis seems inevitable.', 
  'popularity': 1.4, 
  'poster_path': None, 
  'release_date': '1950-06-10', 
  'title': 'The Avengers', 
  'video': False, 
  'vote_average': 10, 
  'vote_count': 1}, 
  
 {'adult': False, 
  'backdrop_path': None, 
  'genre_ids': [16, 28], 
  'id': 487555, 
  'original_language': 'en', 
  'original_title': "The Avengers: Earth's Mightiest Heroes - Prelude", 
  'overview': 'A 110 minute prelude to the 2010 animated series, consisting of five-and-a-half-minute chapters created from footage from season-one episodes, premiered online and on Disney XD on September 22, 2010. Series supervising producer Josh Fine said the goal was to "let us explore the individual members of the team in their own ongoing adventures ... do a lot of character development and set the stage for the rest of the season".', 
  'popularity': 3.21, 
  'poster_path': '/3o7MpOaDkeAcvxqEjgbIcXrcepB.jpg', 
  'release_date': '2010-09-22', 
  'title': "The Avengers: Earth's Mightiest Heroes - Prelude", 
  'video': False, 
  'vote_average': 7.5, 
  'vote_count': 2}]
Asked By: Adeeb

||

Answers:

call your variables like this:

 {% for movie in movies %}
    <div class="grid-container">
        <div class="grid-item">
            <div class="card mb-3" style="max-width: 540px;">
                <div class="row g-0">
                    <div class="col-md-4">
                        <img src="{{ movie.poster_path }}" class="img-fluid rounded-start" alt="..." style="width: 100%; height: 100%;">
                    </div>
                    <div class="col-md-8">
                        <div class="card-body">
                            <h5 class="card-title">{{ movie.title }}</h5>
                            <p class="card-text" style="font-size: 14px;">{{ movie.overview }}</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endfor %}
Answered By: maya

I found a work around..

From the API request, through backend(Flask -> Python), I appended all the titles/ overviews/ poster_paths, into 3 arrays and passed in those arrays along with the length of the API request itself, used len().

Then on index.html, through Jinja, I set a for loop to iterate over the range of the length of the API request, and using indexing, I set the indexes of the arrays I passed in, to the current value of the length of the API request and boom done!!

Simple!!

Answered By: Adeeb
Categories: questions Tags: , , ,
Answers are sorted by their score. The answer accepted by the question owner as the best is marked with
at the top-right corner.