angular - 角度形式的意外 EOF 字符错误,为什么?
问题描述
我已经使用 angular 表单生成器制作了这个表单,但它在控制台中引发了错误。
错误:
compiler.js:1021 Uncaught Error: Template parse errors: Unexpected character "EOF" ("rity.value, Responsible.value)" mat-raised-button color="primary">保存
代码:
<mat-card>
<form [formGroup]="createForm" class="create-form">
<mat-form-field class="field-full-width">
<input matInput placeholder="Title" formControlName="title" #title>
</mat-form-field>
<mat-form-field class="field-full-width">
<input matInput placeholder="Responsible" formControlName="responsible" #responsible>
</mat-form-field>
<mat-form-field class="field-full-width">
<textarea matInput placeholder="Description" formControlName="description" #description>
</mat-form-field>
<mat-form-field class="field-full-width">
<mat-select placeholder="Severity" formControlName="severity" #severity>
<mat-option value="low">Low</mat-option>
<mat-option value="medium">Medium</mat-option>
<mat-option value="high">High</mat-option>
</mat-select>
</mat-form-field>
<mat-divider></mat-divider>
<br>
<br>
<button mat-raised-button color="accent" routerLink="/list">Back</button>
<button type="submit" (click)="addIssue(title.value, description.value, severity.value, responsible.value)" mat-raised-button color="primary">Save</button>
</form>
</mat-card>
.ts
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { Router } from '@angular/router';
import {IssueService} from '../../../issue.service';
@Component({
selector: 'app-create',
templateUrl: './create.component.html',
styleUrls: ['./create.component.css']
})
export class CreateComponent implements OnInit {
createForm: FormGroup;
constructor(private Issue: IssueService, private router: Router, private fb: FormBuilder) {
this.createForm = this.fb.group({
title: '',
description: '',
severity: '',
responsible: ''
});
}
addIssue(title, description, responsible, severity) {
this.Issue.addIssue(title, description, severity, responsible).subscribe(() => {
console.log('Issue added');
this.router.navigate(['/list']);
});
}
ngOnInit() {
}
}
解决方案
原因是您忘记关闭textarea
标签。
<textarea ... formControlName="description" #description></textarea>
/\
||
add this
Angular 遵循 HTML 规范规定的相同限制
推荐阅读
- sql-server - 尝试使用 Logstash 使我的 Elasticsearch 与我的 SQL Server 数据库保持同步会引发字段映射异常
- c - 如何在链接列表中写入/打印?
- r - R - 用循环代替逐行操作,可能需要生成列的滞后
- reactjs - 如何正确地将状态作为道具从一个组件传递到另一个组件?
- python - 从数据框中删除重叠/相同的事务
- python - 为什么 dj-database-url 给我一个错误:需要一个类似字节的对象,而不是“str”,我该如何解决这个问题?
- ios - Swift Map ARRAYS 按日期数组
- python - Python映射对象在减少后变为空
- eclipse - 为什么 Eclipse 拒绝将 Java 类作为 AWS SAM Local 而不仅仅是 Java 运行?
- d3.js - d3.js 在聚集图表上格式化数据标签