angular2-forms

How to upload image/file with formgroup value to API?

做~自己de王妃 提交于 2019-12-24 06:06:04
问题 How to upload image and add it to the form when service doing http.post? example product module needs name, price, coverImage. I tried to use many ways that I can get from the internet, forum, etc. But still got no clue about this issue. I am using model driven form and append it when image is selected and i tried to print out the values of form before send to API. attached image for console.log result: fyi: I am using API based on PHP Laravel. I tried to get the image from "$request->file(

How to upload image/file with formgroup value to API?

懵懂的女人 提交于 2019-12-24 06:05:12
问题 How to upload image and add it to the form when service doing http.post? example product module needs name, price, coverImage. I tried to use many ways that I can get from the internet, forum, etc. But still got no clue about this issue. I am using model driven form and append it when image is selected and i tried to print out the values of form before send to API. attached image for console.log result: fyi: I am using API based on PHP Laravel. I tried to get the image from "$request->file(

Not getting updated value from model in events when implementing value accessor for custom controls

南笙酒味 提交于 2019-12-24 01:45:44
问题 I was following the article below and I'm trying to implement a custom control in angular 2 integrated with ngModel and ngControl. Article: http://almerosteyn.com/2016/04/linkup-custom-control-to-ngcontrol-ngmodel But I'm having a hard to time to figure out how to get the updated model value when emitting events. It seems to use the model before the update in the event. Here is a plunker with an example: https://plnkr.co/edit/ixK6UxhhWZnkFyKfbgky What am I doing wrong? main.ts import

How to check the validity of the child component form within the parent component in Angular 4

我与影子孤独终老i 提交于 2019-12-24 01:17:14
问题 I have a scenario where I am accessing two different NgForm one within Parent form #parentform and other in the Child component #childForm, and i want to check the validity of the controls of child form wether valid or not in parent component form. How to do this in angular4. I also followed this link: Check if a form is valid from a parent component using Angular 4 everytime i am getting undefined for the reference of child component form. My code is something like this. parent.component

How can we set the default value of radio button in angular 2

这一生的挚爱 提交于 2019-12-24 00:54:20
问题 I have a Model driven form and want to show the fields based on radio input. Code :- <div class="form-group"> <md-radio-group class="form-control" id="radio1" formControlName="selection"> <md-radio-button [value]="A" >A</md-radio-button> <md-radio-button [value]="B">B</md-radio-button> </md-radio-group> </div> <div class="form-group" *ngIf="selection.value=='A'"> <md-input-container> <textarea md-input placeholder="A" class="form-control" formControlName="A" style="border:none;"></textarea> <

How to combine 2 way databinding with model driven forms?

给你一囗甜甜゛ 提交于 2019-12-23 19:00:22
问题 In angular 2 one possibility of building forms is the model driven way. As far as I understand, the controls loose their 2 way databinding, in opposite to the template driven way with ngModel. What is the best way of combining 2 way data binding with model driven forms? I tryed to use model binding with [value] : <form [ngFormModel]="hero" (ngSubmit)="onSubmit()"> <div class="form-group"> <label for="name">Name</label> <input type="text" id="name" [value]="hero.value.name" class="form-control

How can I use ngControl in contenteditable element?

烂漫一生 提交于 2019-12-23 18:50:31
问题 How can I use ngControl in contenteditable element? For example, I want: <!-- *ngFor over rows and columns in table --> <td contenteditable="true" [ngControl]="row.number + column.number"></td> With binding (?) it to model-driven "form" (table). I create him with formBuilder based on schema, that retrieve from server. Currently I think that doesnt work, 'cause <td> (and others) element haven't property value . Then, possible to overload some methods to work with textContent property? Or exist

<textarea> default content disappears when adding formControlName the <textarea> element

こ雲淡風輕ζ 提交于 2019-12-23 12:28:18
问题 I'm trying to create a Reactive Form in Angular 4.0.2, which has a <textarea> field with default content, pulled from the database. The content in the <textarea> is showing without any issues, but when I add the formControlName="sectionContent" to the <textarea> element, the content from it disappears. <textarea formControlName="sectionContent ">{{ section.sectionContent }}</textarea > This issue is only happening with the <textarea> element, as I have other <input> fields in the form, but

Custom styles on inputs with angular material 2

删除回忆录丶 提交于 2019-12-23 11:59:26
问题 I am trying to style an input so that it is a certain width. I am using Angular Material 2 but for some reason the styles in the css isn't being applied to the input tag. Here is a working plunker of my issue along with the affected code: @Component({ selector: 'my-app', template: ` <div> <form> <md-input [(ngModel)]="cycleTime" type="number" name="email"> <span md-prefix>Cycle Time:</span> <span md-suffix> minutes</span> </md-input> </form> </div> `, styles:[` input { width: 50px; text-align

How to add/remove FormControl from a nested FormGroup

╄→尐↘猪︶ㄣ 提交于 2019-12-23 11:55:14
问题 candidateForm:FormGroup; constructor(private fBuilder: FormBuilder){ } ngOnInit(){ this.candidateForm = this.fBuilder.group({ fname: [null, [Validators.required]], lname: [null, [Validators.required]], address: this.fBuilder.group({ address1: [null], address2: [null], }) }) } How to add a FormControl named address3 to the form group address ? And similarly how to remove them from the same FormGroup? 回答1: First you have to get the sub FormGroup from your main FormGroup, and then you could use