각도 4에서 트리거링 할 때 제어 라벨이 강조 표시됩니다.

Question

각도 4 유효성 검사에 유효성을 구현 중이며 몇 가지 조정이 필요합니다. 유효성 검사가 제대로 작동하지만 메시지가 표시되는 방식을 변경해야 할 수 있습니다. 현재 폼의 저장 버튼을 클릭하면 컨트롤 아래에 메시지가 표시되고 컨트롤 테두리는 컨트롤 레이블뿐만 아니라 빨간색으로 강조 표시됩니다. 나는 컨트롤 라벨을 빨간색으로 강조하고 싶지 않다. 내가 생각할 수있는 한 가지 방법은 일반 레이블 태그를 사용하는 것입니다. (레이블이) 권장됩니까? 이점은 무엇입니까? ? 어떻게 (레이블)을 사용합니까 아직 라벨이는 for 속성을 사용하여 함께 할 수 없다

<form [formGroup]="newMovieForm" (ngSubmit)="save(newMovieForm.value, newMovieForm.valid)"> 
    <div class="col-sm-12"> 
    <div class="form-group col-sm-6"> 
     <div class="form-group" [ngClass]="{'has-error':!newMovieForm.controls['title'].valid && (saveClicked || newMovieForm.controls['title'].touched)}"> 
     <label for="movie-title" class="control-label">Title of Movie</label> 
     <input type="text" class="form-control" id="movie-title" placeholder="Title of Movie" formControlName="title" maxlength="100"> 
     <!-- The hasError method will tell us if a particular error exists --> 
     <div *ngIf="newMovieForm.controls['title'].hasError('required') && (saveClicked || newMovieForm.controls['title'].touched)" class="alert alert-danger">Title is required.</div> 
     </div> 
    </div> 
</form> 

Answer 1

을 강조하지.

.has-error .control-label { 
    color: #a94442; 
} 

당신은 당신이 원하는 결과를 얻기 위해 레이블에서 해당 클래스를 제거 할 수 있습니다 : 그것은 적용 control-label 클래스를 가지고 있기 때문에 라벨이 빨간색으로 강조되는 이유입니다. source code에서 볼 때이 클래스는 가로, 인라인 또는 네비게이션 폼에서 사용되지 않는 한 레이블 색상에만 영향을줍니다.

여전히 control-label을 사용하려는 경우 CSS를 재정 의하여 색상을 재설정 할 수 있지만 정확한 예에서는 불필요합니다.

This 답변은 특별히 for 속성의 사용에 대해 설명하지만, 내가 말했듯이 여기에 라벨의 강조 표시에는 영향을 미치지 않습니다.