angular 6 ngModel 帶單選按鈕不傳遞任何數據

Question

我想將表單內的單選按鈕鏈接到 object，我無法讓它工作

我將 ngModel 鏈接到一個字符串類型的變量，該變量稱為演示文稿

我不知道我錯過了什么？ 即使我復制一個工作示例，它也不會在我的表單中工作

這是我認為功能失調的表格的一部分：HTML：

<div class="uk-margin-large-right">

  <div class="uk-flex-inline ">
    <span class="uk-form-label uk-margin-small-right uk-text-bold "> Presentation </span>
    <label  class="uk-margin-medium-right">
      <input class="uk-radio " type="radio" name="radio1" value="Cephalic" [(ngModel)]="presentaion"> Cephalic  </label>
    <label class="uk-margin-medium-right">
      <input class="uk-radio" type="radio" name="radio1" value="Breech" [(ngModel)]="presentaion"> Breech </label>
      <label class="uk-margin-medium-right">
        <input class="uk-radio" type="radio" name="radio1" value="Transverse lie" [(ngModel)]="presentaion"> Transverse lie </label>

  </div>
  <p>this is {{presentation}}</p>
</div>

Typescript：

    import { Component, OnInit } from '@angular/core';
import { CommService } from '../services/comm.service';



@Component({
  selector: 'app-form',
  templateUrl: './form.component.html',
  styleUrls: ['./form.component.css']
})
export class FormComponent implements OnInit {


  user = {
    Doctor: '',
    Patient: '',
    Type:'',
    Report: ''
  };

  presentation:'';


  constructor(private CommService: CommService) { }

  ngOnInit() {
    this.CommService.setData(this.user);
    console.log(this.presentation);
  }

}

Answer 1

如果你想給它初始值，像這樣聲明它

  presentaion:string = 'Cephalic';

  log() {  // log the value to console
    console.log(this.presentaion)
  }

模板

   <p>this is {{presentaion}}</p>
   <button (click)="log()">Log the value to console</button>

在您的示例中，屬性名稱存在拼寫錯誤<p>this is {{presentation}}</p>只需將其更改為presentaion

堆棧閃電戰示例