2017-01-23 40 views
1

我正在學習angular2,並陷入了一個場景,我開發了一個表單,通過JSON填充值。我有幾個表單域和幾個文本域,用戶可以輸入任何值並選擇任何選項。基於選擇和輸入的值,我想以JSON的形式捕獲這些表單值。我想我必須使用Observables,但不太確定如何使用它。我該怎麼做?Angular2-如何在JSON中提取/保存/捕獲選定的表單域

下面是我寫的代碼。

<ul> 
    <li> 
    <div *ngFor="let question of questions> 
     <div class="row"> 
      <div class="col-md-12"> 
      <md-input placeholder="{{question.displayKey }}"></md-input> 
      </div> 
     </div> 
     <div class="row row-bordered"> 
      <div class="col-md-8"> {{question.displayKey }}</div> 
      <div class="col-md-4"> 
      <md-radio-group> 
       <span> 
       <md-radio-button *ngFor="let option of question.choices" name="{{option.displayKey}}" [value]="option.displayKey" aria-label="Yes" tabindex="0">{{option.displayKey}}</md-radio-button> 
       </span> 
      </md-radio-group> 
      </div>        
     </div>       
    </div> 
    </li> 
</ul> 

JSON-

"questions": [ 
    { 
    "code": "12345", 
    "displayKey": "Question1?", 
    "required": true, 
    "questionType": "Boolean", 
    "choices": [ 
     { 
     "choiceCode": "true", 
     "displayKey": "Yes" 
     }, 
     { 
     "choiceCode": "false", 
     "displayKey": "No" 
     } 
    ],       
    }, 
    { 
    "code": "aw345y", 
    "displayKey": "Question2?", 
    "required": true, 
    "questionType": "Boolean", 
    "choices": [ 
     { 
     "choiceCode": "true", 
     "displayKey": "Yes" 
     }, 
     { 
     "choiceCode": "false", 
     "displayKey": "No" 
     } 
    ],       
    } 
] 
+0

你應該得到這個功能, 「免費」 一旦您使用模板形式(ngModel)或反應形式(FormBuilder)。這將是該表格的「價值」。 – Zyga

回答

0

<form #form="ngForm" (ngSubmit)="submitForm(form.value)">

和TS文件

submitForm(value){ 
    console.log(value); 
} 
相關問題