Mixing
Create inputs as array in angular form
Tried my level best please help me out..
I am making an angular dynamic form with a form splitting into total of three parts in which the two parts were made already. Now I am making part three which will be generated by selecting an option from dropdown...
Even those part also is done...
But I am unable to make a form array in it... As I am new in angular please help me.
HTML:
Form part 3 will be here which will be array
<select multiple (change)="changeEvent($event)">
<option *ngFor="let opt of persons" [value]="opt.key">{{opt.value}}</option>
</select>
<div *ngFor="let item of array">
{{item.value}} is the parent
<div *ngFor="let child of item.templateChild">
{{child.property_name}}
<div *ngFor="let partThree of questionsParthree">
<ng-container>
<app-question [question]="partThree" [form]="formPartThree"></app-question>
</ng-container>
</div>
</div>
</div>
Select Box change event:
changeEvent(e) {
if (e.target.value == 1) {
this.array = ;
this.array.push(
{
key: 1, value: "Template one",
templateChild: [
{ property_name: "Property one" },
{ property_name: "Property two" }
]
}
);
let propertiesArray = ;
this.array.forEach(element => {
element.templateChild.forEach(data => {
propertiesArray.push(
{
key: data.property_name,
label: data.property_name,
"elementType": "textbox",
"type": "text"
}
)
});
});
this.questionsPartThree = this.service.getQuestions(propertiesArray);
this.formPartThree = this.qcs.toFormGroup(this.questionsPartThree);
this.formJoin = new FormGroup({ form1: this.form, form2: this.formPartTwo, form3: this.formPartThree });
}
}
Continuation like part 1 and 2..
I have posted the code related to creating the form array alone..
Updated Stackblitz https://stackblitz.com/edit/angular-x4a5b6-mnyifs
Here if we select any option then you will get the input boxes with values..
I would like to create array with it like,
If we select the first option Template One, Output expected is exactly as like
"templateChild" : [
{"property_one": "", "property_two":""}
]
So the final output of whole form going to be if i select Template One and also Template Two from select box (as select box is multi select),
{
"form1": {
"project_name": "",
"project_desc": ""
},
"form2": {
"property_one": "",
"property_two": ""
},
"template_details" : [
{ "template_name": "Template One",
"templateChild" : [{"property_one": "", "property_two":""}]
},
{ "template_name": "Template Two",
"templateChild" : [{"property_three": "", "property_four":"",
"property_five":""}]
}
]
}
Have a work around in the demo i have provided and give me a better solution..
Kindly please help me to create a form as like the above when we select an option from dropdown.. If i am wrong in my approach also please correct me..
If i finish this third part then everything will get alright any angular technical expert please help me..
Taking too long please help me out..
javascript angular typescript angular6 angular-reactive-forms
asked Nov 20 '18 at 12:06
Maniraj from KarurManiraj from Karur
1,0391133
add a comment |
Tried my level best please help me out..
I am making an angular dynamic form with a form splitting into total of three parts in which the two parts were made already. Now I am making part three which will be generated by selecting an option from dropdown...
Even those part also is done...
But I am unable to make a form array in it... As I am new in angular please help me.
HTML:
Form part 3 will be here which will be array
<select multiple (change)="changeEvent($event)">
<option *ngFor="let opt of persons" [value]="opt.key">{{opt.value}}</option>
</select>
<div *ngFor="let item of array">
{{item.value}} is the parent
<div *ngFor="let child of item.templateChild">
{{child.property_name}}
<div *ngFor="let partThree of questionsParthree">
<ng-container>
<app-question [question]="partThree" [form]="formPartThree"></app-question>
</ng-container>
</div>
</div>
</div>
Select Box change event:
changeEvent(e) {
if (e.target.value == 1) {
this.array = ;
this.array.push(
{
key: 1, value: "Template one",
templateChild: [
{ property_name: "Property one" },
{ property_name: "Property two" }
]
}
);
let propertiesArray = ;
this.array.forEach(element => {
element.templateChild.forEach(data => {
propertiesArray.push(
{
key: data.property_name,
label: data.property_name,
"elementType": "textbox",
"type": "text"
}
)
});
});
this.questionsPartThree = this.service.getQuestions(propertiesArray);
this.formPartThree = this.qcs.toFormGroup(this.questionsPartThree);
this.formJoin = new FormGroup({ form1: this.form, form2: this.formPartTwo, form3: this.formPartThree });
}
}
Continuation like part 1 and 2..
I have posted the code related to creating the form array alone..
Updated Stackblitz https://stackblitz.com/edit/angular-x4a5b6-mnyifs
Here if we select any option then you will get the input boxes with values..
I would like to create array with it like,
If we select the first option Template One, Output expected is exactly as like
"templateChild" : [
{"property_one": "", "property_two":""}
]
So the final output of whole form going to be if i select Template One and also Template Two from select box (as select box is multi select),
{
"form1": {
"project_name": "",
"project_desc": ""
},
"form2": {
"property_one": "",
"property_two": ""
},
"template_details" : [
{ "template_name": "Template One",
"templateChild" : [{"property_one": "", "property_two":""}]
},
{ "template_name": "Template Two",
"templateChild" : [{"property_three": "", "property_four":"",
"property_five":""}]
}
]
}
Have a work around in the demo i have provided and give me a better solution..
Kindly please help me to create a form as like the above when we select an option from dropdown.. If i am wrong in my approach also please correct me..
If i finish this third part then everything will get alright any angular technical expert please help me..
Taking too long please help me out..
javascript angular typescript angular6 angular-reactive-forms
asked Nov 20 '18 at 12:06
Maniraj from KarurManiraj from Karur
1,0391133
1
check this out.
– Torab Shaikh
Nov 20 '18 at 12:28
In stackblitz.com/edit/angular-x4a5b6-tvuih2 I clarified how create the array. See the changes in question-control.service -to add an array- and how manage a item select multiple (try the part of show the array)
– Eliseo
Nov 21 '18 at 9:54
@Eliseo, Thanks Eliseo, But this example helps me half way only.. Because i am creating input boxes of properties based on the selected dropdown which going to be undertemplate_details.. On each selection, thetemplate_detailsgoing to get added instead of appending each property undertemplate_details.. I kindly request you to refer my expected output in the question that is my expectation.. I would like to appreciate still for your help.. Also i am having doubt should i need to create[formArrayName]for those dynamic textboxes..
– Maniraj from Karur
Nov 21 '18 at 10:30
1
use this as a example and try: stackblitz.com/edit/angular-kbu1kv
– Chellappan
Nov 26 '18 at 6:15
Thanks for your response bro.., If you get time kindly make the expected json as like given in question.. I need to do make it as part three in that single form..
– Maniraj from Karur
Nov 26 '18 at 7:04
add a comment |
Tried my level best please help me out..
I am making an angular dynamic form with a form splitting into total of three parts in which the two parts were made already. Now I am making part three which will be generated by selecting an option from dropdown...
Even those part also is done...
But I am unable to make a form array in it... As I am new in angular please help me.
HTML:
Form part 3 will be here which will be array
<select multiple (change)="changeEvent($event)">
<option *ngFor="let opt of persons" [value]="opt.key">{{opt.value}}</option>
</select>
<div *ngFor="let item of array">
{{item.value}} is the parent
<div *ngFor="let child of item.templateChild">
{{child.property_name}}
<div *ngFor="let partThree of questionsParthree">
<ng-container>
<app-question [question]="partThree" [form]="formPartThree"></app-question>
</ng-container>
</div>
</div>
</div>
Select Box change event:
changeEvent(e) {
if (e.target.value == 1) {
this.array = ;
this.array.push(
{
key: 1, value: "Template one",
templateChild: [
{ property_name: "Property one" },
{ property_name: "Property two" }
]
}
);
let propertiesArray = ;
this.array.forEach(element => {
element.templateChild.forEach(data => {
propertiesArray.push(
{
key: data.property_name,
label: data.property_name,
"elementType": "textbox",
"type": "text"
}
)
});
});
this.questionsPartThree = this.service.getQuestions(propertiesArray);
this.formPartThree = this.qcs.toFormGroup(this.questionsPartThree);
this.formJoin = new FormGroup({ form1: this.form, form2: this.formPartTwo, form3: this.formPartThree });
}
}
Continuation like part 1 and 2..
I have posted the code related to creating the form array alone..
Updated Stackblitz https://stackblitz.com/edit/angular-x4a5b6-mnyifs
Here if we select any option then you will get the input boxes with values..
I would like to create array with it like,
If we select the first option Template One, Output expected is exactly as like
"templateChild" : [
{"property_one": "", "property_two":""}
]
So the final output of whole form going to be if i select Template One and also Template Two from select box (as select box is multi select),
{
"form1": {
"project_name": "",
"project_desc": ""
},
"form2": {
"property_one": "",
"property_two": ""
},
"template_details" : [
{ "template_name": "Template One",
"templateChild" : [{"property_one": "", "property_two":""}]
},
{ "template_name": "Template Two",
"templateChild" : [{"property_three": "", "property_four":"",
"property_five":""}]
}
]
}
Have a work around in the demo i have provided and give me a better solution..
Kindly please help me to create a form as like the above when we select an option from dropdown.. If i am wrong in my approach also please correct me..
If i finish this third part then everything will get alright any angular technical expert please help me..
Taking too long please help me out..
javascript angular typescript angular6 angular-reactive-forms
asked Nov 20 '18 at 12:06
Maniraj from KarurManiraj from Karur
1,0391133
Tried my level best please help me out..
I am making an angular dynamic form with a form splitting into total of three parts in which the two parts were made already. Now I am making part three which will be generated by selecting an option from dropdown...
Even those part also is done...
But I am unable to make a form array in it... As I am new in angular please help me.
HTML:
Form part 3 will be here which will be array
<select multiple (change)="changeEvent($event)">
<option *ngFor="let opt of persons" [value]="opt.key">{{opt.value}}</option>
</select>
<div *ngFor="let item of array">
{{item.value}} is the parent
<div *ngFor="let child of item.templateChild">
{{child.property_name}}
<div *ngFor="let partThree of questionsParthree">
<ng-container>
<app-question [question]="partThree" [form]="formPartThree"></app-question>
</ng-container>
</div>
</div>
</div>
Select Box change event:
changeEvent(e) {
if (e.target.value == 1) {
this.array = ;
this.array.push(
{
key: 1, value: "Template one",
templateChild: [
{ property_name: "Property one" },
{ property_name: "Property two" }
]
}
);
let propertiesArray = ;
this.array.forEach(element => {
element.templateChild.forEach(data => {
propertiesArray.push(
{
key: data.property_name,
label: data.property_name,
"elementType": "textbox",
"type": "text"
}
)
});
});
this.questionsPartThree = this.service.getQuestions(propertiesArray);
this.formPartThree = this.qcs.toFormGroup(this.questionsPartThree);
this.formJoin = new FormGroup({ form1: this.form, form2: this.formPartTwo, form3: this.formPartThree });
}
}
Continuation like part 1 and 2..
I have posted the code related to creating the form array alone..
Updated Stackblitz https://stackblitz.com/edit/angular-x4a5b6-mnyifs
Here if we select any option then you will get the input boxes with values..
I would like to create array with it like,
If we select the first option Template One, Output expected is exactly as like
"templateChild" : [
{"property_one": "", "property_two":""}
]
So the final output of whole form going to be if i select Template One and also Template Two from select box (as select box is multi select),
{
"form1": {
"project_name": "",
"project_desc": ""
},
"form2": {
"property_one": "",
"property_two": ""
},
"template_details" : [
{ "template_name": "Template One",
"templateChild" : [{"property_one": "", "property_two":""}]
},
{ "template_name": "Template Two",
"templateChild" : [{"property_three": "", "property_four":"",
"property_five":""}]
}
]
}
Have a work around in the demo i have provided and give me a better solution..
Kindly please help me to create a form as like the above when we select an option from dropdown.. If i am wrong in my approach also please correct me..
If i finish this third part then everything will get alright any angular technical expert please help me..
Taking too long please help me out..
javascript angular typescript angular6 angular-reactive-forms
javascript angular typescript angular6 angular-reactive-forms
asked Nov 20 '18 at 12:06
Maniraj from KarurManiraj from Karur
1,0391133
asked Nov 20 '18 at 12:06
Maniraj from KarurManiraj from Karur
1,0391133
edited Nov 21 '18 at 6:17
Maniraj from Karur
asked Nov 20 '18 at 12:06
Maniraj from KarurManiraj from Karur
1,0391133
asked Nov 20 '18 at 12:06
Maniraj from KarurManiraj from Karur
1,0391133
asked Nov 20 '18 at 12:06
Maniraj from KarurManiraj from Karur
1,0391133
1,0391133
1
check this out.
– Torab Shaikh
Nov 20 '18 at 12:28
In stackblitz.com/edit/angular-x4a5b6-tvuih2 I clarified how create the array. See the changes in question-control.service -to add an array- and how manage a item select multiple (try the part of show the array)
– Eliseo
Nov 21 '18 at 9:54
@Eliseo, Thanks Eliseo, But this example helps me half way only.. Because i am creating input boxes of properties based on the selected dropdown which going to be undertemplate_details.. On each selection, thetemplate_detailsgoing to get added instead of appending each property undertemplate_details.. I kindly request you to refer my expected output in the question that is my expectation.. I would like to appreciate still for your help.. Also i am having doubt should i need to create[formArrayName]for those dynamic textboxes..
– Maniraj from Karur
Nov 21 '18 at 10:30
1
use this as a example and try: stackblitz.com/edit/angular-kbu1kv
– Chellappan
Nov 26 '18 at 6:15
Thanks for your response bro.., If you get time kindly make the expected json as like given in question.. I need to do make it as part three in that single form..
– Maniraj from Karur
Nov 26 '18 at 7:04
add a comment |
1
check this out.
– Torab Shaikh
Nov 20 '18 at 12:28
In stackblitz.com/edit/angular-x4a5b6-tvuih2 I clarified how create the array. See the changes in question-control.service -to add an array- and how manage a item select multiple (try the part of show the array)
– Eliseo
Nov 21 '18 at 9:54
@Eliseo, Thanks Eliseo, But this example helps me half way only.. Because i am creating input boxes of properties based on the selected dropdown which going to be undertemplate_details.. On each selection, thetemplate_detailsgoing to get added instead of appending each property undertemplate_details.. I kindly request you to refer my expected output in the question that is my expectation.. I would like to appreciate still for your help.. Also i am having doubt should i need to create[formArrayName]for those dynamic textboxes..
– Maniraj from Karur
Nov 21 '18 at 10:30
1
use this as a example and try: stackblitz.com/edit/angular-kbu1kv
– Chellappan
Nov 26 '18 at 6:15
Thanks for your response bro.., If you get time kindly make the expected json as like given in question.. I need to do make it as part three in that single form..
– Maniraj from Karur
Nov 26 '18 at 7:04
1
1
check this out.
– Torab Shaikh
Nov 20 '18 at 12:28
check this out.
– Torab Shaikh
Nov 20 '18 at 12:28
In stackblitz.com/edit/angular-x4a5b6-tvuih2 I clarified how create the array. See the changes in question-control.service -to add an array- and how manage a item select multiple (try the part of show the array)
– Eliseo
Nov 21 '18 at 9:54
In stackblitz.com/edit/angular-x4a5b6-tvuih2 I clarified how create the array. See the changes in question-control.service -to add an array- and how manage a item select multiple (try the part of show the array)
– Eliseo
Nov 21 '18 at 9:54
@Eliseo, Thanks Eliseo, But this example helps me half way only.. Because i am creating input boxes of properties based on the selected dropdown which going to be under
template_details.. On each selection, the template_details going to get added instead of appending each property under template_details.. I kindly request you to refer my expected output in the question that is my expectation.. I would like to appreciate still for your help.. Also i am having doubt should i need to create [formArrayName] for those dynamic textboxes..– Maniraj from Karur
Nov 21 '18 at 10:30
@Eliseo, Thanks Eliseo, But this example helps me half way only.. Because i am creating input boxes of properties based on the selected dropdown which going to be under
template_details.. On each selection, the template_details going to get added instead of appending each property under template_details.. I kindly request you to refer my expected output in the question that is my expectation.. I would like to appreciate still for your help.. Also i am having doubt should i need to create [formArrayName] for those dynamic textboxes..– Maniraj from Karur
Nov 21 '18 at 10:30
1
1
use this as a example and try: stackblitz.com/edit/angular-kbu1kv
– Chellappan
Nov 26 '18 at 6:15
use this as a example and try: stackblitz.com/edit/angular-kbu1kv
– Chellappan
Nov 26 '18 at 6:15
Thanks for your response bro.., If you get time kindly make the expected json as like given in question.. I need to do make it as part three in that single form..
– Maniraj from Karur
Nov 26 '18 at 7:04
Thanks for your response bro.., If you get time kindly make the expected json as like given in question.. I need to do make it as part three in that single form..
– Maniraj from Karur
Nov 26 '18 at 7:04
add a comment |
1 Answer
1
active
oldest
votes
You can dynamically change an AbstractController inside a FormGroup using the setControl() method.
Add an empty form3 part for the moment
this.form3 = new FormGroup({});
this.formJoin = new FormGroup({ form1: this.form, form2: this.formPartTwo, form3: this.form3 })
When selecting an item, generate a new FormGroup according the form you create.
if (e.target.value == 1) {
this.array = ;
this.form3 = new FormGroup({'Property one': new FormControl('insert whatever you want')});
this.formJoin.setControl('form3', this.form3);
You should be able to do something what that start!
answered Nov 20 '18 at 16:50
KapcashKapcash
1,2741620
Here are the changes : stackblitz.com/edit/angular-x4a5b6-v2uqk4?file=src/app/… You have to add the correct binding to the form input to be done
– Kapcash
Nov 20 '18 at 17:08
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53392659%2fcreate-inputs-as-array-in-angular-form%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You can dynamically change an AbstractController inside a FormGroup using the setControl() method.
Add an empty form3 part for the moment
this.form3 = new FormGroup({});
this.formJoin = new FormGroup({ form1: this.form, form2: this.formPartTwo, form3: this.form3 })
When selecting an item, generate a new FormGroup according the form you create.
if (e.target.value == 1) {
this.array = ;
this.form3 = new FormGroup({'Property one': new FormControl('insert whatever you want')});
this.formJoin.setControl('form3', this.form3);
You should be able to do something what that start!
answered Nov 20 '18 at 16:50
KapcashKapcash
1,2741620
Here are the changes : stackblitz.com/edit/angular-x4a5b6-v2uqk4?file=src/app/… You have to add the correct binding to the form input to be done
– Kapcash
Nov 20 '18 at 17:08
add a comment |
You can dynamically change an AbstractController inside a FormGroup using the setControl() method.
Add an empty form3 part for the moment
this.form3 = new FormGroup({});
this.formJoin = new FormGroup({ form1: this.form, form2: this.formPartTwo, form3: this.form3 })
When selecting an item, generate a new FormGroup according the form you create.
if (e.target.value == 1) {
this.array = ;
this.form3 = new FormGroup({'Property one': new FormControl('insert whatever you want')});
this.formJoin.setControl('form3', this.form3);
You should be able to do something what that start!
answered Nov 20 '18 at 16:50
KapcashKapcash
1,2741620
Here are the changes : stackblitz.com/edit/angular-x4a5b6-v2uqk4?file=src/app/… You have to add the correct binding to the form input to be done
– Kapcash
Nov 20 '18 at 17:08
add a comment |
You can dynamically change an AbstractController inside a FormGroup using the setControl() method.
Add an empty form3 part for the moment
this.form3 = new FormGroup({});
this.formJoin = new FormGroup({ form1: this.form, form2: this.formPartTwo, form3: this.form3 })
When selecting an item, generate a new FormGroup according the form you create.
if (e.target.value == 1) {
this.array = ;
this.form3 = new FormGroup({'Property one': new FormControl('insert whatever you want')});
this.formJoin.setControl('form3', this.form3);
You should be able to do something what that start!
answered Nov 20 '18 at 16:50
KapcashKapcash
1,2741620
You can dynamically change an AbstractController inside a FormGroup using the setControl() method.
Add an empty form3 part for the moment
this.form3 = new FormGroup({});
this.formJoin = new FormGroup({ form1: this.form, form2: this.formPartTwo, form3: this.form3 })
When selecting an item, generate a new FormGroup according the form you create.
if (e.target.value == 1) {
this.array = ;
this.form3 = new FormGroup({'Property one': new FormControl('insert whatever you want')});
this.formJoin.setControl('form3', this.form3);
You should be able to do something what that start!
answered Nov 20 '18 at 16:50
KapcashKapcash
1,2741620
answered Nov 20 '18 at 16:50
KapcashKapcash
1,2741620
answered Nov 20 '18 at 16:50
KapcashKapcash
1,2741620
answered Nov 20 '18 at 16:50
KapcashKapcash
1,2741620
1,2741620
Here are the changes : stackblitz.com/edit/angular-x4a5b6-v2uqk4?file=src/app/… You have to add the correct binding to the form input to be done
– Kapcash
Nov 20 '18 at 17:08
add a comment |
Here are the changes : stackblitz.com/edit/angular-x4a5b6-v2uqk4?file=src/app/… You have to add the correct binding to the form input to be done
– Kapcash
Nov 20 '18 at 17:08
Here are the changes : stackblitz.com/edit/angular-x4a5b6-v2uqk4?file=src/app/… You have to add the correct binding to the form input to be done
– Kapcash
Nov 20 '18 at 17:08
Here are the changes : stackblitz.com/edit/angular-x4a5b6-v2uqk4?file=src/app/… You have to add the correct binding to the form input to be done
– Kapcash
Nov 20 '18 at 17:08
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53392659%2fcreate-inputs-as-array-in-angular-form%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
check this out.
– Torab Shaikh
Nov 20 '18 at 12:28
In stackblitz.com/edit/angular-x4a5b6-tvuih2 I clarified how create the array. See the changes in question-control.service -to add an array- and how manage a item select multiple (try the part of show the array)
– Eliseo
Nov 21 '18 at 9:54
@Eliseo, Thanks Eliseo, But this example helps me half way only.. Because i am creating input boxes of properties based on the selected dropdown which going to be under
template_details.. On each selection, thetemplate_detailsgoing to get added instead of appending each property undertemplate_details.. I kindly request you to refer my expected output in the question that is my expectation.. I would like to appreciate still for your help.. Also i am having doubt should i need to create[formArrayName]for those dynamic textboxes..– Maniraj from Karur
Nov 21 '18 at 10:30
1
use this as a example and try: stackblitz.com/edit/angular-kbu1kv
– Chellappan
Nov 26 '18 at 6:15
Thanks for your response bro.., If you get time kindly make the expected json as like given in question.. I need to do make it as part three in that single form..
– Maniraj from Karur
Nov 26 '18 at 7:04