Question: This is my employee.component.html

```
<div class="row">
  <div class="input-field col s12">
    <input type="text" name="name" #name="ngModel" [(ngModel)]="employeeService?.selectedEmployee.name" placeholder="Enter full name"
      required>
    <label>Name :
      <label class="red-text">*</label>
    </label>
  </div>
</div>

```

Below one is the employee.component.ts

```
import { Component, OnInit } from '@angular/core';
import { NgForm } from '@angular/forms';
import { EmployeeService } from '../shared/employee.service';
import { Employee } from '../shared/employee.model';

@Component({
  selector: 'app-employee',
  templateUrl: './employee.component.html',
  styleUrls: ['./employee.component.css'],
  providers: [EmployeeService]
})
export class EmployeeComponent implements OnInit {

  constructor(public employeeService: EmployeeService) { }

  ngOnInit() {
    this.resetForm();
  }

  resetForm(form?: NgForm) {
    if (form) {
      form.reset();
      this.employeeService.selectedEmployee = {
        name: '',
        position: '',
        office: '',
        salary: null
      };
    }
  }

}

```

Chrome throw ***"ERROR TypeError: Cannot read property 'name' of undefined"*** error while loading my angular initial load.

Answer: 
> 
> Cannot read property 'name' of undefined”
> 
> 
> 

Means that some reference to name is wrong. There is only one in your code : `employeeService?.selectedEmployee.name`, therefore `employeeService?.selectedEmployee` is `undefined`. 

Fix
===

Make sure `selectedEmployee` is not undefined, or use safe navigation `employeeService?.selectedEmployee?.name`
@Krishna Rathore
[Screenshot of StackBlitz](https://i.stack.imgur.com/lTHZ5.png)