Angular Customerview

// ---------------------------- customerview.components.ts ----------------------------------------

import { Component, OnInit, Input } from '@angular/core';
import { Observable } from 'rxjs/Rx';

import { Customer } from '../../../models/customer.model';
import { CustomerService } from '../../../services/customer.service';

@Component({
    selector: 'app-customerview',
    templateUrl: './customerview.component.html',
    styleUrls: ['./customerview.component.scss', '../../../css/general.component.scss']
})

export class CustomerviewComponent implements OnInit {
    @Input() extendedCustomer: boolean;
    @Input() detailedCustomer: boolean;
    @Input() customerID: string;

    currentCustomer: Customer;

    constructor(private _customerService: CustomerService) { }

    ngOnInit() {
        this.getCurrentCustomer();
    }

    getCurrentCustomer() {
        this._customerService.getAllCustomers().subscribe(
            (toReturnArray: any[]) => {
                this.currentCustomer = toReturnArray.filter(x => x.id == this.customerID)[0];
            }
        );
    }
}

// ---------------------------- customerview.components.html ----------------------------------------

<!-- Simple-->
<md-card>
    <a [routerLink]="['/customer', customerID]">
        <img src="../../assets/placeholders/carglass.gif" alt="..." class="img_logo_size">
        <md-card-subtitle class="card_subtitle_center">{{currentCustomer?.name}}</md-card-subtitle>
    </a>
    <!-- Extended-->
    <div *ngIf="extendedCustomer">
        <md-card-title class="card_title_center | spikes_red">Address {{currentCustomer?.name}}</md-card-title>
        <md-card-content class="address_container | card_content_center">
            <p>{{location?.streeth}} {{location?.number}}</p>
            <p>{{location?.postcode}} {{location?.city}}</p>
            <p>{{location?.country}}</p>
        </md-card-content>

        <!-- Detailed -->
        <div *ngIf="detailedCustomer">
            <md-card-title class="card_title_center | spikes_red">Contact</md-card-title>
            <md-card-content class="center_md-list">
                <md-list>
                    <md-list-item layout-align="row">
                        <md-icon md-list-avatar>
                            <img src="../../assets/placeholders/sign-in-icon.png" alt="..." class="img_list_size_big">
                        </md-icon>
                        <div class="info_container | more_room_left_contact">
                            <h4>{{customer?.name}}</h4>
                            <h4>{{customer?.title}}</h4>
                            <p>{{customer?.contactNumber}}</p>
                        </div>
                        <span flex></span>
                    </md-list-item>
                </md-list>
            </md-card-content>

            <md-card-title class="card_title_center | spikes_red">Address *customer.name*</md-card-title>
            <md-card-content class="address_container | card_content_center">
                <p>{{location?.streeth}} {{location?.number}}</p>
                <p>{{location?.postcode}} {{location?.city}}</p>
                <p>{{location?.country}}</p>
            </md-card-content>
        </div>
        <br>
    </div>
</md-card>