2017-01-23 8 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); 
}