Include name component in main application

master
Kevin C. Coram 2019-08-27 23:19:24 -04:00
parent 901be9ad09
commit eb1422923f
Signed by: kevin
GPG Key ID: 0342351B3D61AD35
2 changed files with 41 additions and 28 deletions

View File

@ -1,29 +1,10 @@
<div style="text-align:center">
<h1>Welcome to {{ title }}!</h1>
<img
width="450"
src="https://raw.githubusercontent.com/nrwl/nx/master/nx-logo.png"
/>
<form [formGroup]="form">
<nested-forms-name
[name]="contact.name"
[parent]="form"
></nested-forms-name>
</form>
<hr>
<div>
{{ form.value | json }}
</div>
<p>
This is an Angular app built with <a href="https://nx.dev/angular">Nx</a>.
</p>
<p>🔎 **Nx is a set of Extensible Dev Tools for Monorepos.**</p>
<h2>Quick Start & Documentation</h2>
<ul>
<li>
<a href="https://nx.dev/angular/getting-started/what-is-nx"
>10-minute video showing all Nx features</a
>
</li>
<li>
<a href="https://nx.dev/angular/tutorial/01-create-application"
>Interactive tutorial</a
>
</li>
</ul>
<router-outlet></router-outlet>

View File

@ -1,4 +1,6 @@
import { Contact } from '@nested-forms/contact-model';
import { Component } from '@angular/core';
import { FormGroup, FormBuilder } from '@angular/forms';
@Component({
selector: 'nested-forms-root',
@ -7,4 +9,34 @@ import { Component } from '@angular/core';
})
export class AppComponent {
title = 'parent-form';
contact: Contact = {
name: {
firstName: 'John',
lastName: 'Public',
middleName: 'Q',
prefix: 'Mr',
suffix: 'III',
},
addresses: [
{
line_1: '123 Main Street',
city: 'New York',
state: 'NY',
postalCode: '12345',
},
{
line_1: '123 South Street',
city: 'Boston',
state: 'MA',
postalCode: '54321',
},
],
};
form: FormGroup;
constructor(private fb: FormBuilder) {
this.form = this.fb.group({});
}
}