追加' |'在每个数组元素

时间:2017-09-27 13:45:36

标签: javascript json angular typescript

我有这个JSON&我想做的是制作像这个动作|冒险|喜剧

的类型
{
        "id": 1,
        "key": "deadpool",
        "name": "Deadpool",
        "description": "A former Special Forces operative turned mercenary is subjected to a rogue experiment that leaves him with accelerated healing powers, adopting the alter ego Deadpool.",
        "genres": [
            "action",
            "adventure",
            "comedy"
        ],
        "rate": 8.6,
        "length": "1hr 48mins",
        "img": "assets/images/movie-covers/deadpool.jpg"
    },
    {
        "id": 2,
        "key": "we-are-the-millers",
        "name": "We're the Millers",
        "description": "A veteran pot dealer creates a fake family as part of his plan to move a huge shipment of weed into the U.S. from Mexico.",
        "genres": [
            "adventure",
            "comedy",
            "crime"
        ],
        "rate": 7,
        "length": "1hr 50mins",
        "img": "assets/images/movie-covers/we-are-the-millers.jpg"
    }

我的组件代码段

           data => {
                this.movies = data;
                var tempArr= data
                var genres;
               let genresWithPipe=[];          
                let len= tempArr.length;
                for(var i=0; i<len; i++){
                    genres=tempArr[i].genres+'|';
                   // console.log(tempArr[i].genres)
                 for(var j=0;j<genres.length; j++){
                    if(j<genres.length-1)
                    genres[j]= genres[j]+'|';
                    console.log(genres,data);
                    //genresWithPipe=genres;
                }
                }
                console.log(this.movies,genres)


            }

我试图在我的组件中使用for循环来做这件事,但是当我在* ngFor的帮助下在html中显示它然后因为它是一个局部变量,它赢了#t出现。如果我将数组值存储在全局变量中,则该变量仅存储最后一个数组。

2 个答案:

答案 0 :(得分:2)

您可以使用map方法实现您的要求并获得更清晰的解决方案。

  

map()方法创建一个新数组,其中包含调用a的结果   为调用数组中的每个元素提供了函数。

此外,您可以使用join方法获取带有action|adventure|comedy分隔符的结构|

let array=[{ "id": 1, "key": "deadpool", "name": "Deadpool", "description": "A former Special Forces operative turned mercenary is subjected to a rogue experiment that leaves him with accelerated healing powers, adopting the alter ego Deadpool.", "genres": [ "action", "adventure", "comedy" ], "rate": 8.6, "length": "1hr 48mins", "img": "assets/images/movie-covers/deadpool.jpg" }, { "id": 2, "key": "we-are-the-millers", "name": "We're the Millers", "description": "A veteran pot dealer creates a fake family as part of his plan to move a huge shipment of weed into the U.S. from Mexico.", "genres": [ "adventure", "comedy", "crime" ], "rate": 7, "length": "1hr 50mins", "img": "assets/images/movie-covers/we-are-the-millers.jpg" }];       
 array=array.map(function(item){
    item.genres=item.genres.join('|');
    return item;
 });
 console.log(array);

答案 1 :(得分:1)

提出了Array.map()的良好解决方案,这是Array.forEach()的另一个选项:

const data = [{
    "id": 1,
    "key": "deadpool",
    "name": "Deadpool",
    "description": "A former Special Forces operative turned mercenary is subjected to a rogue experiment that leaves him with accelerated healing powers, adopting the alter ego Deadpool.",
    "genres": [
      "action",
      "adventure",
      "comedy"
    ],
    "rate": 8.6,
    "length": "1hr 48mins",
    "img": "assets/images/movie-covers/deadpool.jpg"
  },
  {
    "id": 2,
    "key": "we-are-the-millers",
    "name": "We're the Millers",
    "description": "A veteran pot dealer creates a fake family as part of his plan to move a huge shipment of weed into the U.S. from Mexico.",
    "genres": [
      "adventure",
      "comedy",
      "crime"
    ],
    "rate": 7,
    "length": "1hr 50mins",
    "img": "assets/images/movie-covers/we-are-the-millers.jpg"
  }
]

const genres = [];
data.forEach(film => genres.push(film.genres.join("|")));

console.dir(genres);

请注意,您的data肯定与您在代码示例中的内容不同,必须包含[]