prop-add.component.ts
import { Component } from '@angular/core';
import { Location } from '@angular/common';
import { PropertiesService } from '../services/PropertiesService';
import { Property } from '../../../models/property';

@Component({
    templateUrl: './prop-add.component.html'
})

export class PropAddComponent {
    property: Property;

    constructor(private propertiesService: PropertiesService, private location: Location) { }

    addProperty(addedProperty: Property): void {
        this.propertiesService.addProperty(addedProperty).subscribe(result => { addedProperty = this.property as Property }, err => { console.log(err) });
    }

    goBack() {
        this.location.back();
    }
}


prop-add.component.html
<h2>Add Property</h2>
<div>
    <div>
        <label>Type: </label>
        <input [(ngModel)]="property.type"  />
    </div>
    <div>
        <label>Rooms: </label>
        <input [(ngModel)]="property.rooms" />
    </div>
    <div>
        <label>Short Description: </label>
        <input [(ngModel)]="property.description" />
    </div>
    <div>
        <button (click)="addProperty(property)" [routerLink]="['/properties']">Add</button>
        <button (click)="goBack()">Go Back</button>
    </div>
</div>