[英]Property "#" does not exist on type "#" error
I am following an online course on MEAN stack application.我正在学习关于 MEAN 堆栈应用程序的在线课程。 I am getting the following errors and I cannot figure how to fix it.
我收到以下错误,我无法弄清楚如何修复它。
1.) Below is the code from my employee.component.ts file: 1.) 下面是我的employee.component.ts 文件中的代码:
import { Component, OnInit } from '@angular/core';
import { EmployeeService } from '../shared/employee.service'
@Component({
selector: 'app-employee',
templateUrl: './employee.component.html',
styleUrls: ['./employee.component.css'],
providers: [EmployeeService]
})
export class EmployeeComponent implements OnInit {
constructor(private employeeService: EmployeeService) { }
ngOnInit() {
}
}
2.) Below is the code from my employee.component.html file: 2.) 下面是我的employee.component.html 文件中的代码:
<div class="row">
<div class="col s12">
<div class="card">
<div class="card-content white-text">
<div class="row">
<div class="col sS">
<form #employeeForm="ngForm" (ngSubmit)="onSubmit(employeeForm)">
<input type="hidden" name="_id" #_id="ngModel" [(ngModel)]="employeeService.selectedEmployee._id">
<div class="row">
<div class="input-field col s12">
<input type="text" name="name" #name="ngModel" [(ngModel)]="employeeService.selectedEmployee.name" placeholder="Enter full name">
<label>Name :
<label class="red-text">*</label>
</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input type="text" name="position" #name="ngModel" [(ngModel)]="employeeService.selectedEmployee.position" placeholder="Enter Position">
<label>Position :</label>
</div>
</div>
<div class="row">`enter code here`
<div class="input-field col s12">
<input type="text" name="office" #name="ngModel" [(ngModel)]="employeeService.selectedEmployee.office" placeholder="Enter Office">
<label>Position :</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input type="text" name="salary" #name="ngModel" [(ngModel)]="employeeService.selectedEmployee.salary" placeholder="Enter salary">
<label>Position :</label>
</div>
</div>
</form>
</div>
<div class="col s7">
</div>
</div>
</div>
</div>
</div>
</div>
I am new to this so I am having a difficult time fixing this error.我是新手,所以我很难修复这个错误。 I would greatly appreciate if someone can shed light on this.
如果有人能对此有所了解,我将不胜感激。 Thank you.
谢谢你。
Try to below way:尝试以下方式:
import { Component, OnInit } from '@angular/core';
import { EmployeeService } from '../shared/employee.service'
@Component({
selector: 'app-employee',
templateUrl: './employee.component.html',
styleUrls: ['./employee.component.css'],
})
export class EmployeeComponent implements OnInit {
constructor(private employeeService: EmployeeService) { }
ngOnInit() {
};
onSubmit(employeeForm: NgForm) {
if (employeeForm.value.$key == null) {
this.employeeService.insertEmployee(employeeForm.value);
this.tostr.success('registration Successfully', 'Employee Registered')
employeeForm.reset();
}
}
}
HTML HTML
<div class="row">
<div class="col s12">
<div class="card">
<div class="card-content white-text">
<div class="row">
<div class="col sS">
<form #employeeForm="ngForm" (ngSubmit)="onSubmit(employeeForm)">
<input type="hidden" name="_id" #_id="ngModel" [(ngModel)]="employeeService.selectedEmployee._id">
<div class="row">
<div class="input-field col s12">
<input type="text" name="name" #name="ngModel" [(ngModel)]="employeeService.selectedEmployee.name" placeholder="Enter full name">
<label>Name :
<label class="red-text">*</label>
</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input type="text" name="position" #position="ngModel" [(ngModel)]="employeeService.selectedEmployee.position" placeholder="Enter Position">
<label>Position :</label>
</div>
</div>
<div class="row">`enter code here`
<div class="input-field col s12">
<input type="text" name="office" #office="ngModel" [(ngModel)]="employeeService.selectedEmployee.office" placeholder="Enter Office">
<label>Position :</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input type="text" name="salary" #salary="ngModel" [(ngModel)]="employeeService.selectedEmployee.salary" placeholder="Enter salary">
<label>Position :</label>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
All errors are legit.所有错误都是合法的。 Let's look at your component code:
让我们看看你的组件代码:
export class EmployeeComponent implements OnInit {
constructor(private employeeService: EmployeeService) { }
ngOnInit() {
}
}
First of all, your component do not have onSubmit method that your template is trying to use (ngSubmit)="onSubmit(employeeForm)"
首先,您的组件没有您的模板尝试使用的onSubmit方法
(ngSubmit)="onSubmit(employeeForm)"
Furthermore, multiple place in template you are accessing employeeService
vari able, make it public instead of private if you want to use if in the template as: constructor(public employeeService: EmployeeService) { }
此外,模板中的多个地方您正在访问
employeeService
变量,如果您想在模板中使用 if 将其设为 public 而不是私有的: constructor(public employeeService: EmployeeService) { }
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.