Currently, I am in the process of learning angular2 and have encountered a roadblock. I have created a form where the values are populated through JSON. The form consists of both pre-filled fields and text input fields where users can enter data and select options. My goal is to capture these form values as JSON based on user input. I believe Observables might be the solution, but I am unsure about how to implement them. Can anyone provide guidance on how I can achieve this?
Here is the code snippet that I have developed:
<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 Output:
"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"
}
]
}
]