Angular 4 button disabled icon is not showing

Question

Console image of the inspected element

Issue: When my button has the disabled attribute and I hover over it the disabled icon is not showing.

Can someone please suggest how I can resolve this issue?

I've attached a code snippet below:

<form (ngSubmit)='onSubmit(form)' *ngIf="!submitted" #form="ngForm"> 
    <input required #password="ngModel" [(ngModel)]="stackDefaultData.password" name="password" type="password" class="form-control"> 
    <button type="submit" [disabled]="form.invalid">Submit</button> 
</form>     

Answer 1

This should work:

<button  type="submit" disabled="!form.valid" 
  [ngStyle]="{'cursor': (!form.valid? 'not-allowed':'pointer')}">Submit</button>