输入字段很脏，仅在IE11（Angular8）中显示红色边框验证

Question

大家好：)这是我的第一个问题，希望您能正确理解。

在我的登录屏幕上，我有“用户名”和“密码”字段。在IE 11上加载网站时，第二个输入（“密码”）一直很脏，并显示红色边框验证，我不希望在那里。当我删除一个占位符时，一切正常，但是我需要那个占位符...

我已经进行了大量研究并应用了指令来验证'blur'上的字段（没有重点），但仅在IE 11上仍然存在相同的问题。有人有我可以使用的适当答案或解决方案吗？这是我的密码输入代码的示例（与用户名输入具有相同的属性）：

模板：

<div class="column column-10-of-12">
        <att-input attTheme                        
                   validate-onblur
                   class="input--inline"
                   [shouldShowError]="carePortal.submitted"
                   formControlName="password"
                   (focus)="focusPassword()"
                   [id]="'password'"
                   [name]="'password'"
                   [type]="'password'"
                   placeholder="Password">
          <div [att-error-message]="loginForm.get('password')"
               #inputError>
            <att-error-label validator="minlength"
                             [errMessage]="'Password needs to be min 5 characters.'">
            </att-error-label>

          </div>
        </att-input>
      </div>

TS：

initializeLoginForm(): void {
    this.loginForm = this.formBuilder.group({
      userName: [
        '',
        Validators.compose([
          <any>Validators.required,
          Validators.pattern(this.usernamePattern)
        ])
      ],
      password: [ 
        '',
        Validators.compose([
          <any>Validators.required,
          <any>Validators.minLength(5) 

        ])
      ]
    });
  }

Answer 1

您是否在CSS中尝试过此方法？ -

input:required:invalid {
    outline: none;
}