Question

我有以下代码尝试从ng新模板制作有角度的应用程序。我正在以此为指导。 https://malcoded.com/posts/angular-backend-express

在谷歌搜索时，我在打字稿github上发现了这是最简单的事情。 https://github.com/Microsoft/TypeScript/issues/24835

在提出这个问题的同时，我遇到了这个问题，但是我认为编写的解决方案不能解决我的问题。 error TS2559: Type 'Headers' has no properties in common with type 'RequestOptionsArgs'

app.component.ts

import { Component } from '@angular/core';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { HttpClient } from '@angular/common/http';
export interface Data {
data: string;
}

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
  })

@Injectable()
export class AppComponent {
  constructor(private http: HttpClient) {}
  title = 'My Star Database';

  Character(name: string) 
  {
  }
  sendCharacter(name: string): Observable<Data> {
          return this.http.get<Data>('http://localhost:8000/api/character/', name);
                  }
                  getCharacterData(name: string): Observable<Data> {
                          var data =  this.http.get<Data>('http://localhost:8000/api/character/', name);
                          console.log(data);
                          }

  }

错误

ERROR in src/app/app.component.ts(24,71): error TS2559: Type 'string' has no properties in common with type '{ headers?: HttpHeaders | { [header: string]: string | string[]; }; observe?: "body"; params?: HttpParams | { [param: string]: string | string[]; }; reportProgress?: boolean; responseType?: "json"; withCredentials?: boolean; }'.
src/app/app.component.ts(26,37): error TS2355: A function whose declared type is neither 'void' nor 'any' must return a value.
src/app/app.component.ts(27,78): error TS2559: Type 'string' has no properties in common with type '{ headers?: HttpHeaders | { [header: string]: string | string[]; }; observe?: "body"; params?: HttpParams | { [param: string]: string | string[]; }; reportProgress?: boolean; responseType?: "json"; withCredentials?: boolean; }'.

附带说明 另外，我想在代码中添加导出接口并在get请求中更改为代码，因为我在具有字符串返回类型的get请求时遇到错误。这是我第一次用打字稿写作，我不得不说在那个错误（我已经解决了）和您在上面看到的那个错误之间，我觉得打字稿真的不应该得到它的名字。我希望有角度的开发人员坚持使用javascript。很抱歉，我对这种语言感到非常沮丧，而且我对编程并不陌生。我喜欢三个C和Python。

更新 app.components.ts

import { Component } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { HttpClient } from '@angular/common/http';
export interface Data {
data: string;
}

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
  })

export class AppComponent {
  constructor(private http: HttpClient) {}
  title = 'My Star Database';

  Character(name: string) 
  {
  }
  sendCharacter(name: string): Observable<Data> {
          return this.http.get<Data>('http://localhost:8000/api/character/?name='+ name);
                  }
                  getCharacterData(name: string): {
                           data =  this.http.get<Data>('http://localhost:8000/api/character/?name='+ name);
                          console.log(data);
                          }

  }

错误 src / app / app.component.ts（27,7）中的错误：错误TS1131：应为属性或签名。 src / app / app.component.ts（28,13）：错误TS1005：';'预期。 src / app / app.component.ts（31,3）：错误TS1128：需要声明或声明。

Answer 1

错误1是由于在 http.get 函数中传递了无效参数所致。 http.get 的第二个参数应该是标头。如果要在get中传递参数，请将其作为URL参数。

return this.http.get<Data>('http://localhost:8000/api/character/?name='+name);

错误2是因为您没有从 getCharacterData（）函数返回任何内容。要么删除返回选项，即

getCharacterData(name: string) {
    var data =  this.http.get<Data>('http://localhost:8000/api/character/?name='+name);
    console.log(data);
}

或返回数据，

getCharacterData(name: string): Observable<Data> {
    return this.http.get<Data>('http://localhost:8000/api/character/?name='+name);
}

错误3是错误1的重复

角度为“错误TS2559：类型'string'与类型'{headers没有共同的属性：HttpHeaders“

1 个答案: