2016-05-29 20 views
-2

image1次のJavaScript変数からアクセスします。オブジェクト内の配列JavaScript JavaScript

image1ソースをテンプレートの下に配置する必要があります。

image1 URLをJavaScriptコードのテンプレートに挿入します。

どうすればよいですか?

var animals_data = { 
    category : [ 
     { 
      name : "Reptiles", 
      animals : [ 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/7/76/Coast_Garter_Snake.jpg/500px-Coast_Garter_Snake.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/5/5b/Nerodia_sipedon_shedding.JPG/440px-Nerodia_sipedon_shedding.JPG", 
        name : "Snake", 
        description : "Snakes are elongated" 
       }, 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/f/f9/Crocodilia_collage.jpg/600px-Crocodilia_collage.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/3/3e/Caiman_crocodilus_Tropicario_2.JPG/440px-Caiman_crocodilus_Tropicario_2.JPG", 
        name : "Crocodilia", 
        description : "The Crocodilia " 
       }, 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/1/18/Bartagame_fcm.jpg/500px-Bartagame_fcm.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/Lizard_in_Yemen.JPG/440px-Lizard_in_Yemen.JPG", 
        name : "Lizard", 
        description : "Lizards are a widespread group of squamate reptiles" 
       }, 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/8/86/Chelonia_mydas_is_going_for_the_air.jpg/440px-Chelonia_mydas_is_going_for_the_air.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/1/1d/Turtle3m.JPG/500px-Turtle3m.JPG", 
        name : "Turtle", 
        description : "Turtles are reptiles " 
       }, 
      ] 
     }, 
     { 
      name : "Mammals", 
      animals : [ 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/a/ae/AfricanWildCat.jpg/440px-AfricanWildCat.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/b/bb/Kittyply_edit1.jpg/440px-Kittyply_edit1.jpg", 
        name : "Cat", 
        description : "The domestic cat (Felis catus or Felis silvestris catus) is a small, usually furry, domesticated, and carnivorous mammal. " 
       }, 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/8/8c/Poligraf_Poligrafovich.JPG/340px-Poligraf_Poligrafovich.JPG", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/a/a5/Cavalier_King_Charles_Spaniel_trio.jpg/440px-Cavalier_King_Charles_Spaniel_trio.jpg", 
        name : "Dog", 
        description : "The domestic dog (Canis lupus familiaris or Canis familiaris) is a domesticated canid which has been selectively bred for millennia for various behaviors, sensory capabilities, and physical attributes. " 
       }, 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/6/6c/Diademed_ready_to_push_off.jpg/440px-Diademed_ready_to_push_off.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/3/34/Three_chimpanzees_with_apple.jpg/640px-Three_chimpanzees_with_apple.jpg", 
        name : "Primate", 
        description : "A primate is a mammal of the order Primates (Listeni/praɪˈmeɪtiːz/ pry-may-teez; Latin: \"prime, first rank\"). " 
       }, 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/0/0d/%D0%9C%D1%8B%D1%88%D1%8C_2.jpg/500px-%D0%9C%D1%8B%D1%88%D1%8C_2.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Fancy_mice.jpg/500px-Fancy_mice.jpg", 
        name : "Mouse", 
        description : "A mouse (plural: mice) is a small rodent characteristically having a pointed snout, small rounded ears, a body-length scaly tail and a high breeding rate. The best known mouse species is the common house mouse (Mus musculus). It is also a popular pet. In some places, certain kinds of field mice are locally common. They are known to invade homes for food and shelter." 
       }, 
      ] 
     }, 
     { 
      name : "Birds", 
      animals : [ 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/8/8e/American_Flamingo_-_Phoenicopterus_ruber.jpg/440px-American_Flamingo_-_Phoenicopterus_ruber.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/9/94/Caribbean_flamingo.jpg/440px-Caribbean_flamingo.jpg", 
        name : "American flamingo", 
        description : "The American flamingo" 
       }, 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/a/aa/Papageitaucher_Fratercula_arctica.jpg/600px-Papageitaucher_Fratercula_arctica.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/4/4b/Atlantic_Puffin_Fratercula_arctica.jpg/440px-Atlantic_Puffin_Fratercula_arctica.jpg", 
        name : "Atlantic puffin", 
        description : "The Atlantic puffin " 
       }, 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/1/19/%C3%81guila_calva.jpg/440px-%C3%81guila_calva.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/d/d6/Golden_Eagle_in_flight_-_5.jpg/440px-Golden_Eagle_in_flight_-_5.jpg", 
        name : "Eagle", 
        description : "Eagle is a common name for many large birds of prey of the family Accipitridae; " 
       }, 
       { 
        image1 : "https://upload.wikimedia.org/wikipedia/commons/thumb/e/ec/Ara_ararauna_Luc_Viatour.jpg/440px-Ara_ararauna_Luc_Viatour.jpg", 
        image2 : "https://upload.wikimedia.org/wikipedia/commons/thumb/4/4e/Rose-ringed_Parakeet_eating_leaves.JPG/440px-Rose-ringed_Parakeet_eating_leaves.JPG", 
        name : "Parrot", 
        description : "Parrots, also known as psittacines /ˈsɪtəsaɪnz/,[2][3] are birds of the roughly 372 species in 86 genera that make up the order Psittaciformes, found in most tropical and subtropical regions. " 
       }, 
      ] 
     }, 

    ] 
}; 
+0

テンプレートを、あなたは私がすることを特定の形式でそれをやってみたかった場合 user2594853

+0

コメントなどの関連情報を追加しないでください適切な書式で質問に追加するには[edit](http://stackoverflow.com/posts/37511275/edit)を使用します。 –

+0

オブジェクトに 'image1'をすべて入れたいですか? – Mohammad

答えて

1

この

<img class="crop-img" src="{{animals[0].image1}}" alt=""/> 

のようにそれを実行します。しかし、あなたは動物をループされていないので、これが唯一のあなたに、各カテゴリ内の最初の動物の最初の画像が表示されます。

関連する問題