错误类型错误：无法读取未定义的属性“getUsers”

Posted 2023-02-22

【中文标题】错误类型错误：无法读取未定义的属性“getUsers”

【英文标题】：ERROR TypeError: Cannot read property 'getUsers' of undefined

【发布时间】：2019-04-14 07:44:01

【问题描述】：

listuser.component.ts

import  Component, OnInit  from '@angular/core';
import  User  from 'src/app/user';
import  UserService  from 'src/app/shared_service/user.service';

@Component(
  selector: 'app-listuser',
  templateUrl: './listuser.component.html',
  styleUrls: ['./listuser.component.css']
)
export class ListuserComponent implements OnInit 
  private users:User[];
  _userService: any;
  constructor(private_userService:UserService)  

  ngOnInit() 
    this._userService.getUsers().subscribe((users)=>
      console.log(users);
      this.users=users;
    ,(error)=>
      console.log(error);
    )
  

user.service.ts

import  Injectable  from '@angular/core';
import  Http, Response, Headers, RequestOptions from '@angular/http';
import  Observable  from 'rxjs';
import  'rxjs/add/operator/map';
import 'rxjs-compat';
import 'rxjs/add/operator/catch';
import  'rxjs/add/observable/throw';

import  User  from '../user';

@Injectable(
  providedIn: 'root'
)
export class UserService 
  private baseUrl:string="http://localhost:8080/api";
  private headers = new Headers('Content-Type':'application/json');
  private options = new RequestOptions(headers:this.headers);
  _http: any;
  constructor(private_http:Http)  

  getUsers()
  
    return this._http.get(this.baseUrl+'/users',this.options).map((response:Response)=>response.json())
    .catch(this.errorHandler);

  
  getUser(id:Number)
  
    return this._http.get(this.baseUrl+'/user/'+id,this.options).map((response:Response)=>response.json())
    .catch(this.errorHandler);

  
  deleteUser(id:Number)
  
    return this._http.delete(this.baseUrl+'/user/'+id,this.options).map((response:Response)=>response.json())
    .catch(this.errorHandler);

  
  createUsers(user:User)
  
    return this._http.post(this.baseUrl+'/users',JSON.stringify(user), this.options).map((response:Response)=>response.json())
    .catch(this.errorHandler);

  
  updateUsers(user:User)
  
    return this._http.put(this.baseUrl+'/users',JSON.stringify(user), this.options).map((response:Response)=>response.json())
    .catch(this.errorHandler);

  
  errorHandler(error:Response)
    return Observable.throw(error||'SERVER ERROR');
  

运行此之后..错误： 在 ListuserComponent.push../src/app/components/listuser/listuser.component.ts.ListuserComponent.ngOnInit (listuser.component.ts:16) 在 checkAndUpdateDirectiveInline (core.js:18620) 在 checkAndUpdateNodeInline (core.js:19884) 在 checkAndUpdateNode (core.js:19846) 在 debugCheckAndUpdateNode (core.js:20480) 在 debugCheckDirectivesFn (core.js:20440) 在 Object.eval [as updateDirectives] (ListuserComponent_Host.ngfactory.js?[sm]:1) 在 Object.debugUpdateDirectives [as updateDirectives] (core.js:20432) 在 checkAndUpdateView (core.js:19828) 在 callViewAction (core.js:20069)

【问题讨论】：

你有一个类型错误是 private_http 和 private_userService

注意：您使用的是 Angular 2 语法。不久前，Angular 5、6 和 7 出现了。事情会朝着最好的方向改变。现在不使用Http，否则HttpClient，不使用Rxjs 5，否则Rxjs 6...

【参考方案1】：

您似乎忘记在构造函数中的 private 之后和 _userService 之前添加空格：

constructor(private _userService:UserService)  

【讨论】：

请将答案标记为完整，并对您认为正确的答案进行投票。

【参考方案2】：

你需要在private和_userService之间添加空格，所以这个

constructor(private_userService:UserService)  

应该是

constructor(private _userService: UserService)  

【讨论】：

非常感谢先生

【参考方案3】：

您的服务类中有几个问题 -

private 和 _http 之间的空格 删除附加声明的实例变量_http: any;

修改后的代码

import  Injectable  from '@angular/core';
import  Http, Response, Headers, RequestOptions from '@angular/http';
import  Observable  from 'rxjs';
import  'rxjs/add/operator/map';
import 'rxjs-compat';
import 'rxjs/add/operator/catch';
import  'rxjs/add/observable/throw';

import  User  from './user';

@Injectable(
  providedIn: 'root'
)
export class UserService 
  private baseUrl:string="http://localhost:8080/api";
  private headers = new Headers('Content-Type':'application/json');
  private options = new RequestOptions(headers:this.headers);
  constructor(private _http:Http)  

  getUsers()
  
    return this._http.get(this.baseUrl+'/users',this.options).map((response:Response)=>response.json())
    .catch(this.errorHandler);

  
  getUser(id:Number)
  
    return this._http.get(this.baseUrl+'/user/'+id,this.options).map((response:Response)=>response.json())
    .catch(this.errorHandler);

  
  deleteUser(id:Number)
  
    return this._http.delete(this.baseUrl+'/user/'+id,this.options).map((response:Response)=>response.json())
    .catch(this.errorHandler);

  
  createUsers(user:User)
  
    return this._http.post(this.baseUrl+'/users',JSON.stringify(user), this.options).map((response:Response)=>response.json())
    .catch(this.errorHandler);

  
  updateUsers(user:User)
  
    return this._http.put(this.baseUrl+'/users',JSON.stringify(user), this.options).map((response:Response)=>response.json())
    .catch(this.errorHandler);

  
  errorHandler(error:Response)
    return Observable.throw(error||'SERVER ERROR');
  

【讨论】：

@Sunil，您使用的是 Angular 2 语法。不久前，Angular 5、6 和 7 出现了。事情会朝着最好的方向改变。现在不使用Http，否则HttpClient，不使用Rxjs 5，否则Rxjs 6...

@Eliseo - 这个语法不是我的，而是由 Rohit 共享的，我们正在为他遇到的问题提供解决方案。 Rohit 可能使用的是旧版本。

对不起，我会把评论发给 Rohit