클릭하면 각도 오류가 발생 함

Question

바로 지금 md-error 페이지가로드되고 입력 막대가 입력되면 작동하지만 "추가"버튼을 클릭 할 때만 활성화하고 싶습니다. 당신이 조언을 줄 수 있다면, 그것은 매우 도움이 될 것입니다.

```

Answer 1

import { Component, OnInit } from '@angular/core'; 
 
import { FormGroup, FormControl, FormBuilder,Validators} from '@angular/forms' 
 
import { MdInputModule } from '@angular/material' 
 

 
@Component({ 
 
    selector: 'app-root', 
 
    templateUrl: './app.component.html', 
 
    styleUrls: ['./app.component.css'] 
 
}) 
 
export class AppComponent implements OnInit { 
 

 
    public details: [Detail]; 
 

 
    sample = new FormControl('',[ 
 
    Validators.required, 
 
    ]) 
 

 
    myForm = this.builder.group({ 
 
    sample: this.sample 
 
    }); 
 

 
constructor(
 
    private builder:FormBuilder, 
 
    private MdInputModule: MdInputModule 
 
){} 
 

 
addDetail(){ 
 
    if(this.sample.errors !==null){ 
 
    console.log("データないよ") 
 
    }else 
 
    {console.log(this.sample.value)} 
 
} 
 

 
onSave(){} 
 

 
ngOnInit() {} 
 

 
} 
 

 
class Detail{ 
 
    public sample : FormControl; 
 
}

<form [formGroup]="myForm"> 
 
     <input mdInput type="number" required placeholder="数量" [formControl] ="sample"/> 
 
     <md-error *ngIf="this.sample.errors?.required"> 
 
     　need to inform. 
 
     </md-error> 
 
    <div class="footer-div"> 
 
     <button md-raised-button (click)="addDetail();">add</button> 
 
     <button md-raised-button (click)="onSave();">save</button> 
 
    </div> 
 
</form>

당신이 타이프 라이터와 false로 설정에서 변수 호출 submitted을 만들 수 있습니다. 다음과 같이 귀하의 의견에 (change)를 사용

<input mdInput type="number" (change)="submitted=false". 
     required placeholder="数量" [formControl] ="sample"/> 

을 당신 addDetail() 방법 추가 : this.submitted = true;이 다음 MD-오류 추가로 :

<md-error *ngIf="this.sample.errors?.required && submitted"> 
　need to inform. 
</md-error> 

그래서 매번 입력 값 변경의 가정을 당신은 아직 제출하지 않았습니다. 그러면 제출할 때 변수를 true으로 설정하고 *ngIf은 두 조건을 모두 평가합니다.

희망이 있습니다.

감사합니다.