Question

我想应用这种风格：

 [ngClass]="{'login-form__text login-form__email' : '!displayErrors', 
                 'login-form__text login-form__email-confirm error': 'displayErrors && this.Form.get(\'email\').value !=\"" && !Form.valid && Form.errors?.mismatch'}"

不幸的是，我收到了这个错误：

Unexpected character "EOF" (Do you have an unescaped "{" in your template? Use "{{ '{' }}") to escape it.) ("

而且我确定这是因为我在我的班级里面有引号而且我没有正确地逃脱它们。我试图逃避上面价值检查的双重报价。但它仍然显示错误。

如何正确逃避上面的字符串？

Answer 1

您必须将expression传递给[ngClass]，而不是字符串：

此外，displayErrors是variable，因此您应该将其用作变量。

[ngClass]="{'login-form__text login-form__email' : !displayErrors, 
            'login-form__text login-form__email-confirm error': displayErrors && 
            this.Form.get('email').value !== '' && Form.hasError('mismatch') }"

或者，如果电子邮件是required，您可以简化：

[ngClass]="{'login-form__text login-form__email' : !displayErrors, 
            'login-form__text login-form__email-confirm error': displayErrors && 
            !this.Form.get('email').hasError('required') && Form.hasError('mismatch') }"

提示

您无需检查表单是否不有效，如果有mismatch错误，您可以使用{检查它是否有错误 {1}}方法。

在双引号和单引号内转义双引号

1 个答案: