javascript - 在第一个结果中获取下拉列表的返回值 [object Object]。当我选择一个选项并工作时,它会改变。如何修复默认结果
问题描述
我有一个 Angular 7 应用程序。我已经调用服务来获取 mysql 数据。在一个表单中,我想填充一个下拉列表并想要验证它。但是下拉列表一开始总是有一个未定义的值,所以我不能用必需的来验证它。为什么它一开始有一个[object Object]?但是当我正确选择一个值时它会起作用。
我已经在一个组件中使用它并且使用下面的代码效果很好
Component.ts file
this.employeeservice.retrieveAllTodos().subscribe(
response => {
this.employeesList = response;
console.log("it works");
}
);
<select class="custom-select custom-select-sm" [class.ng-invalid]="!ecode.value" name="ecode" #ecode="ngModel" required [ngModel]="ecode" (ngModelChange)="getId($event,ecode.value)">
<option *ngFor="let todo of employeesList" value={{todo.employeeCode}}>{{todo.employeeCode}} - {{todo.employeeName}}</option>
</select>
<div *ngIf="ecode.errors && (ecode.dirty || ecode.touched || todoForm1.submitted)">
<div *ngIf="ecode.errors.required">
<small class="form-text text-muted">Please select code</small>
</div>
<div *ngIf="ecode.invalid">
<small class="form-text text-muted">Please select code1</small>
</div>
</div>
<pre> {{ecode.value}}</pre>
<pre *ngIf="ecode.value === null">no value</pre>
https://imgur.com/OjSF2Wv https://imgur.com/JY7zhYD
我已经包含了 2 张我的情况的图片
解决方案
问题在于这"[ngModel]="ecode""
看起来像 ecode 是一个对象
将其更改为 ."[ngModel]="ecode.value""
它应该可以工作
推荐阅读
- mongodb - 更新嵌套数组中的特定元素
- javascript - 如何在 JAVASCRIPT 中识别具有 ClassName 和 onlick 事件的按钮?
- node.js - 来自一个非常简单的查询程序的“.then 不是函数”
- html - Layout styling with responsive design using CSS
- python - 使用烧瓶将表单数据和列表值传递到 HTML 页面
- python - Where do I add in an re.search in this python code?
- python - Python:将CSV文件的多列转换为嵌套的Json
- python - Is there a way to insert a list into the .format method in python?
- python - How to solve the error : polls is not defined by django beginner tutorial
- javascript - 如何在 javascript 中解析特定查询参数的 URL?