title: Keep checkbox checked in angular
body: <p>Using angular 9 and some custom input I made the following =&gt;</p>
  <p><a href="https://stackblitz.com/edit/angular-ivy-rgsatp" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-ivy-rgsatp</a></p>
  <p>I would like to prevent user from disabling a radio button that is currently checked, so I changed the following in <code>radio-button.component</code></p>
  <p>from</p>
  <pre><code>&lt;label [class]=&quot;'radio-container ' + cssClass || ''&quot;&gt;
    &lt;div class=&quot;radio&quot;&gt;
      {{ checked }}
      &lt;input type=&quot;checkbox&quot; [checked]=&quot;checked&quot; [(ngModel)]=&quot;checked&quot; (click)=&quot;click()&quot; /&gt;
      &lt;span class=&quot;checkmark&quot;&gt;&lt;/span&gt;
    &lt;/div&gt;
  
    &lt;div style=&quot;margin-left: 20px;&quot;&gt;
      &lt;ng-content&gt;&lt;/ng-content&gt;
    &lt;/div&gt;
  &lt;/label&gt;
  </code></pre>
  <p>I remove the binding of ngModel to do <code>[ngModel]=&quot;checked&quot;</code> and force the state on the input.</p>
  <p><a href="https://stackblitz.com/edit/angular-ivy-x2sszw" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-ivy-x2sszw</a></p>
  <p>The problem I face i, although the check stay true, the css do not, and I do not understand why it's not forced to check.</p>