title: Deselect and toggle a radio button in angular 10
body: <p>I have 3 radio buttons grouped as follows. And I want to select and deselect each radio button. And only one radio button should be active at once.</p>
  <pre class="lang-html prettyprint-override"><code>&lt;div&gt;
    &lt;input type=&quot;radio&quot; name=&quot;colors&quot; (click)=&quot;color='lightgreen'&quot; [(ngModel)]=&quot;color&quot;&gt;Green
    &lt;input type=&quot;radio&quot; name=&quot;colors&quot; (click)=&quot;color='yellow'&quot; [(ngModel)]=&quot;color&quot;&gt;Yellow
    &lt;input type=&quot;radio&quot; name=&quot;colors&quot; (click)=&quot;color='cyan'&quot; [(ngModel)]=&quot;color&quot;&gt;Cyan
  &lt;/div&gt;
  </code></pre>
  <pre class="lang-js prettyprint-override"><code>@Component({
    selector: 'app-color',
    templateUrl: './color.component.html'
  })
  export class ColorComponent {
    color: string;
    .........
  }
  </code></pre>
  <p>The above code doesn't work. If I use <code>[(ngModel)]=&quot;color&quot;</code> in one <code>&lt;input type=&quot;radio&quot; ...&gt;</code> I can toggle that radio button. But selecting that radio button is interpreted as deselected and deselected as selected. Having <code>[(ngModel)]=&quot;color&quot;</code> in all three breaks the code entirely.</p>
  <p>Can someone please explain how to get this done ?</p>
  <p><strong>EDIT:</strong></p>
  <p>Found a way to deselect the radio buttons by introducing a button. But toggle doesn't work.</p>
  <pre class="lang-html prettyprint-override"><code>&lt;div&gt;
    &lt;input type=&quot;radio&quot; [(ngModel)]=&quot;color&quot; name=&quot;colors&quot; value=&quot;lightgreen&quot;/&gt;Green
    &lt;input type=&quot;radio&quot; [(ngModel)]=&quot;color&quot; name=&quot;colors&quot; value=&quot;yellow&quot;/&gt;Yellow
    &lt;input type=&quot;radio&quot; [(ngModel)]=&quot;color&quot; name=&quot;colors&quot; value=&quot;cyan&quot;/&gt;Cyan
    &lt;button type=&quot;button&quot; class=&quot;btn btn-secondary&quot; (click)=&quot;color=''&quot;&gt;Reset&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  <p>Thanks a lot.</p>