Angular template form not validating a field and displaying the validation message

So I hope you could help me with this, i have created a component where I have added a two way bidding to a model and i have added an event on ngSubmit but when i submit the form the name input field is not validated

    <form #formId="ngForm" (ngSubmit)="submitForm(formId.value)" >
        <div class="form-group">
            <label>Name</label>
            <input class="form-control" type="text" placeholder="Name" name="name" 
            #name="ngModel" [(ngModel)]="signUpModel.name" >
            <span style="color:red;" *ngIf="name.invalid">Invalid Name please check the value</span>
        </div>
        <div class="form-group">
            <label>Last Name</label>
            <input class="form-control" type="text" placeholder="Last Name" name="lastName"
             [(ngModel)]="signUpModel.lastName" >
        </div>
        <div class="form-group">
            <label>Email</label>
            <input class="form-control" type="email" placeholder="Email" name="email"
            [(ngModel)]="signUpModel.email" >
        </div>
        <div class="form-group">
            <label>Password</label>
            <input class="form-control" type="Password" placeholder="Password" name="password"
            [(ngModel)]="signUpModel.password" >
        </div> 
        <div class="form-group">
            <button class="btn btn-primary" >Submit</button>
        </div>
   </form>

it brings the values directly to the form but it doesnt display the span with *ngIf