javascript - 当值为 false 时，绑定 required 和 attr.required 无法按预期工作

问题描述

我正在使用Angular版本6.0.7。

我有四个<input>字段，只有在提供第一个字段时才需要最新的三个字段。[attr.required]="<boolean here>"我试图通过使用and使其工作[required]="<boolean here>"，但是当绑定值为 false 时，不会从输入中删除所需的属性。

<div class="col">
    <h3 class="mb-3">Ensino superior</h3>
    <div class="form-group">
      <label for="ad-higher-education-institution">Nome da instituição</label>
      <input
        [(ngModel)]="client.academic_data.higher_education.institution"
        id="ad-higher-education-institution"
        name="ad-higher-education-institution"
        type="text"
        class="form-control">
    </div>
    <div class="row">
      <div class="col form-group">
        <label for="ad-higher-education-city">Cidade</label>
        <input
          [(ngModel)]="client.academic_data.higher_education.city"
          [attr.required]="client.academic_data.higher_education.institution && client.academic_data.higher_education.institution.length > 0"
          id="ad-higher-education-city"
          name="ad-higher-education-city"
          type="text"
          class="form-control">
      </div>
      <div class="col form-group">
        <label for="ad-higher-education-state">Estado</label>
        <input
          [(ngModel)]="client.academic_data.higher_education.state"
          [attr.required]="client.academic_data.higher_education.institution && client.academic_data.higher_education.institution.length > 0"
          id="ad-higher-education-state"
          name="ad-higher-education-state"
          type="text"
          class="form-control">
      </div>
    </div>
    <div class="form-group">
      <label for="ad-higher-education-course">Curso</label>
      <input
        [(ngModel)]="client.academic_data.higher_education.course"
        [attr.required]="client.academic_data.higher_education.institution && client.academic_data.higher_education.institution.length > 0"
        id="ad-higher-education-course"
        name="ad-higher-education-course"
        type="text"
        class="form-control">
    </div>
    <div class="form-group">
      <label for="ad-high-school-conclusion-year">Ano de conclusão</label>
      <input
        [(ngModel)]="client.academic_data.higher_education.conclusion_year"
        [attr.required]="client.academic_data.higher_education.institution && client.academic_data.higher_education.institution.length > 0"
        id="ad-higher-education-conclusion-year"
        name="ad-higher-education-conclusion-year"
        type="text"
        class="form-control"
        mask="0*">
    </div>
  </div>
</div>

required第一个输入未填满时如何去掉属性？

这是第一个填充时的输入：

<input 
  class="form-control ng-valid ng-dirty ng-touched" 
  id="ad-higher-education-city" name="ad-higher-education-city" type="text" ng-reflect-name="ad-higher-education-city" ng-reflect-model="" 
  required="true">

这是第一个未填充时的输入：

<input 
  class="form-control ng-valid ng-dirty ng-touched" 
  id="ad-higher-education-city" name="ad-higher-education-city" type="text" ng-reflect-name="ad-higher-education-city" ng-reflect-model="" 
  required>

标签： javascriptangular

javascript - 当值为 false 时，绑定 required 和 attr.required 无法按预期工作

问题描述

解决方案

推荐阅读