Display data from data.json in poem format

I want to do list of poems- I already create the list and create data.json file as shown down

      "title": "Red Rose",
      "photo": "Red_Rose",
      "poem": [
        "Roses are red",
        "Violets are blue",
        "Sugar is sweet",
        "And so are you."

and create detail page to display the poem, but the page show the poem like this
[ “Roses are red”, “Violets are blue”, “Sugar is sweet”, “And so are you.” ]
and my detail file like this

    <ion-list class="list-inset">
      <ion-item class="item-text-wrap"
        ng-repeat="item in artists | filter:{ photo: whichartist }">
        <img ng-src="img/{{item.photo}}_tn.jpg"
             alt="{{ item.title }} Photo">
        <h2>{{ item.title }}</h2>
        <p>{{ item.poem}}</p>

every thing display well except the {{item.poem}}
it shown like this
[ "Roses are red", "Violets are blue", "Sugar is sweet", "And so are you." ]

any one have idea how to do it in the right way

item.poem is an JSON array so our output is not as expected.
You could loop trough the item.poem within your item loop and output the single lines with a break or whatever.

Btw: Putting your code in a pre-formatted block makes it more readable

Please edit your post and use the </> button above the post input field to format your code or error message or wrap it in ``` (“code fences”) manually. This will make sure your text is readable and if it recognizes the programming language it also automatically adds code syntax highlighting. Thanks.

Sujan12, thanks for your reply, can you explain more for me, I need this urgent
where can I edit my code, and where to add the button

gregg, thanks, please explain more, can you prepare the code with loop for me, to test and feedback for You, I really failed to display it as poem

You should make the code in your post readable. I can’t read anything of it.

I fixed the code format problem - can you help me to solve the problem please

The problem with simply doing:

<p>{{ item.poem}}</p>

Is that item.poem is an array, so what you may want to do is something like:

<p *ngFor="let line of item.poem">{{line}}</p>

SigmundFroyd, thanks for your reply, but that not work for me- it give empty white page - can you help more