Javascript 如何循环得到角度为5的不同数组？

这是

api

JSON

我想把所有的问题和选项分别放在循环中。为此，我写了下面的代码

{  
   "status":"true",
   "select":[  
      {  
         "view_":"select",
         "Type":"MARKET_WORKING",
         "Question":"WHICH BRAND COUNTER IS IT?",
         "options":[  
            {  
               "option":"USPA"
            },
            {  
               "option":"HANES"
            },
            {  
               "option":"USPA & HANES "
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            }
         ]
      }
   ],
   "text":[  
      {  
         "view_":"select",
         "Type":"MARKET_WORKING",
         "Question":"WHAT IS THE OPENING STOCK OF INNERWEARS TOP?",
         "options":[  
            {  
               "option":"VEST"
            },
            {  
               "option":"BRA_PADDED"
            },
            {  
               "option":"BRA_NON PADDED"
            },
            {  
               "option":"CAMISOLE"
            },
            {  
               "option":"THERMAL"
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            }
         ]
      },
      {  
         "view_":"select",
         "Type":"MARKET_WORKING",
         "Question":"WHAT IS THE OPENING STOCK OF INNERWEARS BOTTOM?",
         "options":[  
            {  
               "option":"BRIEF"
            },
            {  
               "option":"TRUNKS"
            },
            {  
               "option":"PANTIES"
            },
            {  
               "option":"THERMAL LEGGINGS"
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            }
         ]
      },
      {  
         "view_":"select",
         "Type":"MARKET_WORKING",
         "Question":"WHAT IS THE OPENING STOCK OF COMFORTWEARS TOP?",
         "options":[  
            {  
               "option":"MEN'S T SHIRT"
            },
            {  
               "option":"MEN'S TANKS"
            },
            {  
               "option":"WOMEN'S T SHIRT"
            },
            {  
               "option":"WALL FIXTURE"
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            }
         ]
      },
      {  
         "view_":"select",
         "Type":"MARKET_WORKING",
         "Question":"WHAT IS THE OPENING STOCK OF COMFORTWEARS BOTTOM?",
         "options":[  
            {  
               "option":"BOXER SHORTS"
            },
            {  
               "option":"MEN'S SHORTS"
            },
            {  
               "option":"MEN'S PANTS"
            },
            {  
               "option":"MEN'S SOCKS"
            },
            {  
               "option":"WOMEN'S SHORTS"
            },
            {  
               "option":"WOMEN'S PANTS"
            },
            {  
               "option":"WOMEN'S CAPRI"
            },
            {  
               "option":"WOMEN'S SOCKS"
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            },
            {  
               "option":""
            }
         ]
      }
   ]
}

下面是html

  if(this.user_type == 1){

        this.mwork = this.navParams.get('mwork');
        this.selectq = this.mwork.select;
        this.selecto = this.selectq[0].options;
        //this.selecto = this.selectq.options;
        this.textq = this.mwork.text;
        this.texto = this.textq[0].options;

        console.log(this.selecto);
    }

从这里开始

  <div class="field-group" *ngFor="let mworkq of textq">
        <div class="label-cust">
              {{mworkq.Question}}
              <ion-input *ngFor="let mworkq of texto" class="{{mworkq.option}}" type="text" placeholder="{{mworkq.option[i]}}" ></ion-input>

        </div>
       </div> 

---

也许我误解了你。但是你为什么不使用

 for (const selectItem1 of this.mwork.text){ 
             this.textq = selectItem1.Question;       
               for (const selectItem2 of this.mwork.text){
                      this.texto = selectItem2.options;      
                    }     
        }

然后呢

*ngFor="let option of options; index as i"

---

注意：

索引为i

语法需要Angular 5+

选中此项，它将在selecto数组中存储所有选项，而不考虑问题

values[i]

---

json对象有三个属性，

status

、

select

和

text

看起来是这样的：

   if(this.user_type == 1){

        this.mwork = this.navParams.get('mwork');
        this.selectq = this.mwork.select;

        for(i in this.selectq)
        { 
          for(k in this.selectq[i].options)
             this.selecto.push(this.selectq[i].options[k]);
        }

        this.textq = this.mwork.text;
        this.texto = this.textq[0].options;

        console.log(this.selecto);
    }

我想把所有的问题和选项都放在一个循环中 分别

你可以试试这个。请注意，我觉得您的结构非常奇怪……嵌套循环只是在这里突出显示了糟糕的结构

{
 status: "",
 select: [{
   view_:"",
   Type:"",
   Question:"",
   options:[{}]
 }],
 text: [{
   {
   view_:"",
   Type:"",
   Question:"",
   options:[{}]
 }
 }]
}

编辑：

根据您的问题编辑，您正在使用*ngFor指令，因此您需要将数据存储在迭代器中。例如：

this.mwork = this.navParams.get('mwork');

for (const selectItem of this.mwork.select){
  console.log(selectItem.Question);
  for (const option of selectItem.options){
    console.log(option.option);
  }
}

然后在模板中：

*ngFor=“让mworkData成为mworkData的一部分”

然后您可以使用：

---

mworkData.question

和

mworkData.answerOptions

我刚刚将html代码更改为下面的代码，它就可以工作了。我在

ts

文件中选择api。它给了我一个未定义的定义。我刚刚从api提交的

ts

文件中获取了第一个循环的

集合。然后对于
第二个循环，我使用第一个循环的值作为第二个循环的
集合
，然后在它之后添加
。选项
，作为选项循环

const mworkDatas = [];
for (const selectItem1 of this.mwork.text) {
  const question = selectItem1.Question;
  let answerOptions = [];
  for (const selectItem2 of this.mwork.text) {
   answerOptions  = selectItem2.options; 
  }
  mworkDatas.push({
    question,
    answerOptions
  });
} 


{{mworkq.问题}
挑选
{{mworkq.option}
{{mworkq.问题}
你可以使用
for（Object.keys的cont-keys（this.mwork.select）
进行迭代。你能解释一下怎么做吗。因为我对后端功能
对象不太熟悉。keys（instanceObject）
将返回每个objects属性，所以你可以迭代并访问你的selectq，然后你可以对它做同样的事情
（Object.keys的const textKeys（this.mwork.text）
要访问所有用于Object.keys的文本我在控制台中得到了0我正在写一个答案，我没有看到你的select和text是一个项目的数组^^@SagarKodte你没有像他建议的那样使用索引。在哪里使用值[I]获取选项unDebug是一个错误，你可以重试。但是如果你可以的话，请考虑一下你的结构。是的，我试过了……仍然给出那个错误。但是问题就在这里了。{this.texto=selectItem2.options；}}我编辑了您的代码，并在控制台中获得了q和答案。但在html中使用它时，数据不可用comming@SagarKodte你能编辑你的问题并告诉我“你如何在hml中使用它”吗？代码中有什么问题，请告诉我。为什么会被否决？我相信Sagar要求一个按问题对答案进行分组的结构。“但现在发生的情况是，由于[0]，所有问题中只出现了第一个选项值。因此，我如何使其动态显示与这些问题相应的选项。请帮助。谢谢。”代码可能会工作，不幸的是它没有回答他的问题。我也否决了这个问题，如果它能让你感觉更好的话：P我不完全确定对数据结构和基本for循环的误解/如何使用Angular来显示它们属于StackOverflow。等待mods来评论：D@SeanAirey，我写的代码使它成为动态的，不是吗？this.selectq=this.mwork.select；for（i in this.selectq）{for（k in this.selectq[i].options）this.selecto.push（this.selectq[i].options[k]）；}标记为mod注意删除my-1，因为您必须编辑答案…在这里，在循环之前和之后添加一些空格，我可能能够在mods看到我的标记之前删除它：）@SeanAirey，添加空格
const mworkDatas = [];
for (const selectItem1 of this.mwork.text) {
  const question = selectItem1.Question;
  let answerOptions = [];
  for (const selectItem2 of this.mwork.text) {
   answerOptions  = selectItem2.options; 
  }
  mworkDatas.push({
    question,
    answerOptions
  });
} 

<div class="field-group"  *ngFor="let mworkq of selectq">
        <div class="label-cust">{{mworkq.Question}}</div>
        <div class="field-cust">
          <select [(ngModel)]="selectedOption">
            <option value=''>Select</option>
            <option [hidden]="mworkq.option == null || mworkq.option.length == 0" *ngFor="let mworkq of mworkq.options" value="{{mworkq.option}}">{{mworkq.option}}</option>

           <!--  <option value="{{mworkq.option4}}">{{mworkq.option4}}</option> -->

          </select>
        </div>
      </div>
      <div class="field-group" *ngFor="let mworkq of textq">
        <div class="label-cust">
              {{mworkq.Question}}
              <ion-input [hidden]="mworkq.option == null || mworkq.option.length == 0"  *ngFor="let mworkq of mworkq.options" class="{{mworkq.option}}" type="number" placeholder="{{mworkq.option}}" ></ion-input>

        </div>
      </div>