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

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.) ("

而且我确定这是因为我的 ngclass 中有引号，而我没有正确地转义它们。我试图在上面的值检查中转义双引号。但它仍然显示错误。

如何正确转义上面的字符串？

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 错误，您只需使用hasError() 检查它是否有一些错误方法。