0

In brief, I want to create components of text input fields, so as to replace the commented out code that works with the component.

<app-text-input [name]="Address" [mod]="resto.address" class="col-sm"></app-text-input>
<!--<div class="form-group col-sm">
  <label for="Address">Address</label>
  <input type="text" class="form-control" id="Address" name="Address" [(ngModel)]="resto.address" >
</div>-->

my component reads

@Component({
  selector: 'app-text-input',
  template: `
    <div class="form-group">
      <label for="name">{{name}}</label>
      <input type="text" class="form-control" id="name" name="name" [(ngModel)]="mod" >
    </div>
  `,
  styles: ['']
})
export class TextInput {
  @Input() name: String;
  @Input() mod;

  constructor() { }
}

I get the value of the field being set, but none of the changes are making it back up. I'm pretty sure I am doing something fundamentally wrong but all the examples I found online to date are in the long-hand style I am trying to abstract out.

Simon H
  • 20,332
  • 14
  • 71
  • 128
  • Maybe you can explore a pattern like [this](http://stackoverflow.com/a/38649690/2587435) – Paul Samsotha Apr 15 '17 at 10:31
  • 1
    Or [custom form controls](https://blog.thoughtram.io/angular/2016/07/27/custom-form-controls-in-angular-2.html) – Paul Samsotha Apr 15 '17 at 10:36
  • 1
    I would suggest you move over to reactive form here, makes your life so much easier in this case. This is an example of empty form, but you can set the form fields with default values in the parent that will then be passed to the child via the Input form group, and best of all, the parent will capture the changes :) http://stackoverflow.com/questions/43270564/dividing-a-form-into-multiple-components-with-validation and here's some more info: https://scotch.io/tutorials/how-to-build-nested-model-driven-forms-in-angular-2 – AT82 Apr 15 '17 at 10:52
  • hmmm. This was a micro and quick project so I just went with ngModel. I think I'll stick with cut/paste for the time being and explore these patterns later – Simon H Apr 15 '17 at 11:09

0 Answers0