zgo/src/app/business/business.component.html

<app-header></app-header>
<div align="center">
	<mat-card class="centercard" [formGroup]="bizForm">
		<p>Business Information</p>
		<mat-form-field appearance="outline">
			<mat-label>Business Name</mat-label>
			<input matInput placeholder="Business Name" formControlName="name">
		</mat-form-field>
		<mat-form-field appearance="outline">
			<mat-label>Address</mat-label>
			<input matInput placeholder="Address" formControlName="street">
		</mat-form-field>
		<mat-form-field appearance="outline">
			<mat-label>City</mat-label>
			<input matInput placeholder="City" formControlName="city">
		</mat-form-field>
		<mat-form-field appearance="outline">
			<mat-label>State/Province</mat-label>
			<input matInput placeholder="State or Province" formControlName="state">
		</mat-form-field>
		<mat-form-field appearance="outline">
			<mat-label>Postal Code</mat-label>
			<input matInput placeholder="Postal Code" formControlName="postal">
		</mat-form-field>
		<mat-form-field appearance="outline">
			<mat-label>Country</mat-label>
			<input matInput placeholder="Country" formControlName="country" [matAutocomplete]="auto">
			<mat-autocomplete #auto="matAutocomplete">
				<mat-option *ngFor="let ctry of countries | searchOptions:bizForm.get('country')!.value" [value]="ctry.name">
					{{ctry.name}}
				</mat-option>
			</mat-autocomplete>
		</mat-form-field>
		<mat-form-field appearance="outline">
			<mat-label>E-mail</mat-label>
			<input matInput placeholder="E-mail" formControlName="email">
		</mat-form-field>
		<mat-form-field appearance="outline">
			<mat-label>Website</mat-label>
			<input matInput placeholder="Website" formControlName="website">
		</mat-form-field>
	</mat-card>
</div>