Search code examples
booleanradio-buttonangular8checked

Radio button checked with boolean attribute


Using angular 8, I am generating a list of user context where the user can select his connection context. As one of the context proposed is always the current context, I want to be able to check the radio button when current context is true, so on the user context dropdown opening, the current context is automatically checked.

Problem is, I can't find a way to bind the checked property to a boolean. Something like : checked="currentUser.currentContext".


          <tr *ngFor="let reworkedCollabspace of reworkedCollabspaces; let i = index">
            <td>
              <input type="radio" name="selectUserContext" id="checkBox{{i}}"
                     (click)="updateSelectedCollabspace(reworkedCollabspace, i)"
                     (change)="enableChangeContextBtn()">
            </td>
            <td>
              <ul>
                <li>{{ reworkedCollabspace.domain }}</li>
                <li>{{ reworkedCollabspace.organization }}</li>
                <li>{{ reworkedCollabspace.role }}</li>
                <li>prefered : {{ reworkedCollabspace.prefered }}</li>
                <li>current : {{ reworkedCollabspace.current }}</li>
                <li>selected : {{ reworkedCollabspace.selected }}</li>
              </ul>
            </td>
          </tr>

        </table>

Solution

  • So far the best approach I found is the use of

    [attr.checked]="respondent.genderType=='1' ? 'checked' : null"
    

    Plus to wrap the radio into a form. See those 2 related posts for more information :