我有一个 Angular4 应用程序,它从表单中捕获数据并存储在 DynamoDB 中。它使用 ngModel 支持双向数据绑定,并且在显示器上看起来都不错。由于输入字段键入为绑定到 Typescript 的“数字”字段的“文本”,因此出现问题。似乎正在将对象值的类型更改为“字符串”。我会简单地将 HTML 输入类型更改为“数字”,除了表单字段上不必要和不需要的增量/减量装饰器(隐藏它们似乎支持有限)。所以我很好奇是否有另一种方法可以保持数据结构按需要输入……如果这是 ngModel 中的错误……或者输入类型只需要是“数字”。
我的 sample.component.ts 文件中的结构如下所示:
export class Course {
Id: number;
Name: string;
}
...
courseInstance: Course;
saveCourse() {
JSON.stringify(this.courseInstance);
}
Run Code Online (Sandbox Code Playgroud)
我的 sample.component.html 文件如下所示:
<div>
<label for="courseid">Course ID: </label>
<input type="text" class="form-control"[(ngModel)]="courseInstance.Id" name="courseid">
</div>
<div>
<label for="courseName">Course Name: </label>
<input type="text" class="form-control"[(ngModel)]="courseInstance.Name" name="courseName">
</div>
<div>
<button type="button" class="btn btn-info btn-lg" (click)="saveCourse()">Save</button>
</div>
Run Code Online (Sandbox Code Playgroud)
JSON.stringify(this.courseInstance) 的输出结果类似于
{"Id":"100","Name":"Test course"}
Run Code Online (Sandbox Code Playgroud)
请注意表示为字符串的值 100。
如果我不使用表单,而只是创建一个实例,例如
courseInstance: Course = {
Id: 100,
Name: 'Test course'
}; …Run Code Online (Sandbox Code Playgroud)