单选按钮的值在离子角度上的显示方式不同

Question

我正在使用离子，我想在单选按钮上显示数据值。我在获取值并将其设置为正确值时遇到问题。

的index.html     

    <td>
      <label>{{learningtest.Questions}}</label>
    </td>
    <td *ngFor="let button of learningtest.Buttons">
      <input type="radio" 
      ng-model="learningtest.selectedAnswer" 
      name="button{{idx}}" 
      value="{{learningtest.Buttons[idx]}}"
      >button{{idx}}           
      {{learningtest.Buttons[idx] | json}}
    </td>
   <td>
      <p>{{learningtest.selectedAnswer}}</p>
   </td>
  </tr>

打字稿：

learningtests = [{
    Questions: "You have a personal or private interest or hobby that you like to do alone.",
    selectedAnswer: "",

    Buttons: [{
        Button: "0"
      },
      {
        Button: "1"
      },
      {
        Button: "2"
      }
    ]


  },



  {
    Questions: "You keep a journal or personal diary to record your thoughts.",
    selectedAnswer: "",

    Buttons: [{
        Button: "0"
      },
      {
        Button: "1"
      },
      {
        Button: "2"
      }
    ]

  },
  {
    Questions: "You use rhythm or rhyme to remember things, eg phone numbers, passwords, other little sayings.",
    selectedAnswer: "",

    Buttons: [{
        Button: "0"
      },
      {
        Button: "1"
      },
      {
        Button: "2"
      }
    ]
  },

  {
    Questions: "You like logic games and brainteasers. You like chess and other strategy games.",
    selectedAnswer: "",

    Buttons: [{
        Button: "0"
      },
      {
        Button: "1"
      },
      {
        Button: "2"
      }
    ]
  },

  //5
  {
    Questions: "You are a tinkerer. You like pulling things apart, and they usually go back together OK. You can easily follow instructions represented in diagrams.",
    selectedAnswer: "",

    Buttons: [{
        Button: "0"
      },
      {
        Button: "1"
      },
      {
        Button: "2"
      }
    ]
  }
]

输出：

Answer 1

应该是

<td *ngFor="let learn of learningtest">
   <table>
      <tr>
         <td *ngFor="let btn of learn.Buttons">
            <input type="radio" [(ngModel)]="learn.selectedAnswer"
               name="button{{idx}}" 
               [value]="btn">
            button{{idx}}           
            {{btn | json}}
         </td>
      </tr>
   </table>
</td>

使用 [(ngModel)] 也可以使用嵌套的ngFor

<强> DEMO