无线电按钮未显示在嵌套离子列表中



我有一个嵌套列表,带有文本和无线电按钮,该列表在离子2中不显示。

这是一个绝望的情况,我已经坐了几个小时了。最糟糕的是,它用来工作,但是由于将框架更新为2.0.0-rc.6,它不再渲染了。

<ion-list class="opl-question-container">
        <ion-item *ngFor="let opl of Opls">
            <ion-item *ngFor="let q of opl.Questions" class='questionDescibe' text-wrap>
                <ion-list-header>
                    {{ q.QuestionName }}
                </ion-list-header>
                <ion-list radio-group text-wrap>
                    <ion-item *ngFor="let a of q.Answers">
                        <ion-label class="opl-question-answers">{{a.AnswerDescription}}</ion-label>
                        <ion-radio [value]='a.AnswerDescription'></ion-radio>
                    </ion-item>
                </ion-list>
            </ion-item>
        </ion-item>
    </ion-list>

如果我只用文本替换离子标签和离子 - 拉迪奥。

也许关于如何解决此问题的任何建议?

这是OPL的结构

{
"Opl_Id": 103,
"OplDescription": "Lesson One",
"Questions": [
  {
    "Question_Id": 11,
    "QuestionName": "1. How are you today?",
    "QuestionDescription": "1. How are you today?",
    "QuestionType": "radio",
    "Answers": [
      {
        "Answer_Id": 33,
        "AnswerDescription": "I am well thanks",
        "Correct": false,
        "DateCreated": "0001-01-01T00:00:00",
        "DateUpdated": "0001-01-01T00:00:00"
      },
      {
        "Answer_Id": 34,
        "AnswerDescription": "Could be better but not too bad",
        "Correct": false,
        "DateCreated": "0001-01-01T00:00:00",
        "DateUpdated": "0001-01-01T00:00:00"
      },
      {
        "Answer_Id": 35,
        "AnswerDescription": "Not too good",
        "Correct": true,
        "DateCreated": "0001-01-01T00:00:00",
        "DateUpdated": "0001-01-01T00:00:00"
      }
    ]
  },

谢谢

我使用此结构

让它工作
<ion-col *ngFor="let opl of Opls">
  <ion-col *ngFor="let q of opl.Questions">
    <ion-list radio-group>
      <ion-list-header>
        {{q.QuestionName}}
      </ion-list-header>
      <ion-item *ngFor="let a of q.Answers">
        <ion-label class="opl-question-answers">{{a.AnswerDescription}}</ion-label>
        <ion-radio [value]='a.AnswerDescription'></ion-radio>
      </ion-item>
    </ion-list>
  </ion-col>
</ion-col>

这取代了我认为在*ngFor上嵌套重复的psuedo ion-listion-item,这引起了与布局显示的冲突

相关内容

  • 没有找到相关文章

最新更新