【问题标题】:Property "#" does not exist on type "#" error类型“#”错误中不存在属性“#”
【发布时间】:2020-03-03 12:41:53
【问题描述】:

我正在学习有关 MEAN 堆栈应用程序的在线课程。我收到以下错误,我不知道如何解决。

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.) 下面是我的 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>

我是新手,所以我很难修复这个错误。如果有人能阐明这一点,我将不胜感激。谢谢。

【问题讨论】:

  • 你不应该用 angularjs 标记这个

标签: html angularjs angular mean-stack


【解决方案1】:

尝试以下方式:

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

<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>

【讨论】:

    【解决方案2】:

    所有错误都是合法的。让我们看看你的组件代码:

    export class EmployeeComponent implements OnInit {
    
      constructor(private employeeService: EmployeeService) { }
    
      ngOnInit() {
      }
    
    }
    

    首先,您的组件没有您的模板尝试使用的 onSubmit 方法(ngSubmit)="onSubmit(employeeForm)"

    此外,您正在访问的模板中有多个位置employeeService vari 如果您想在模板中使用 if ,请将其设为公开而不是私有: constructor(public employeeService: EmployeeService) { }

    【讨论】:

      猜你喜欢
      • 2018-01-29
      • 1970-01-01
      • 2022-09-23
      • 2021-07-04
      • 2018-05-28
      • 1970-01-01
      • 2019-07-20
      • 2019-02-18
      • 2020-02-13
      相关资源
      最近更新 更多