小标签不适用于输入标签

Question

编码是，

<input type="tel" required #phone=ngModel pattern='^\d{10}$' [ngClass]="{'is-invalid': !phone.valid}" name="phone" class="form-control" [(ngModel)]="userModel.phone">
  <small [class.d-none]=”phone.valid || phone.untouched”>Phone number is required and must be ten digits</small>

输出控制台给出，

compiler.js:2427 Uncaught Error: Template parse errors:
Parser Error: Unexpected token Lexer Error: Unexpected character [”] at column 1 in expression [”phone.valid] at column 2 in [”phone.valid] in ng:///AppModule/AppComponent.html@58:9 ("-invalid': !phone.valid}" name="phone" class="form-control" [(ngModel)]="userModel.phone">
  <small [ERROR ->][class.d-none]=”phone.valid || phone.untouched”>Phone number is required and must be ten digits</smal"):

我使用双单引号作为''而不是双引号作为“，它给出的错误消息是，

未捕获的错误：模板解析错误： 意外的结束标签“小”。当标签已被另一个标签关闭时，可能会发生这种情况。有关详细信息，请参阅https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags ("ll [class.d-none]=''phone.valid || phone.untouched''>电话号码是必填项，必须是十位数字[ERROR ->]

Answer 1

你用错了引号：

[class.d-none]=”phone.valid || phone.untouched”

应该改为：

[class.d-none]="phone.valid || phone.untouched"

Answer 2

替换

<small [class.d-none]=”phone.valid || phone.untouched”>Phone number is required and must be ten digits</small>

与：

<small [class.d-none]="phone.valid || phone.untouched">Phone number is required and must be ten digits</small>