角7类继承& httpClient

Question

好的，所以我意识到我的服务是非常复制和粘贴的。所以我想尝试一下超类和继承的角度。不像我想的那么顺利。我真的要挂在构造函数和超级调用上了。TS编译正确，没有错误，但这是我在控制台中得到的。

core.js:12632 ERROR Error: Uncaught (in promise): TypeError: this.http.get is not a function

现在，我假设对于我所有的依赖项，这将继续下去。

这是我的BaseService课程：

    import {EventEmitter, Output} from '@angular/core';
    import { environment } from '../../environments/environment';

    export abstract class BaseService {
        @Output() saving = new EventEmitter();
        constructor(
            public api_url: string,
            public success_message: string,
            public success_url: string,
            public nav_to_view: boolean,
            public http,
            public toaster,
            public router,
        ) {
            this.api_url = environment.api + this.api_url;
        }

        list() {
            return this.http.get(this.api_url);
        }
   }

下面是扩展BaseService的服务：

import {Injectable} from '@angular/core';
import {BaseService} from '../../core/base.service';
import {HttpClient} from '@angular/common/http';
import {ToastrService} from 'ngx-toastr';
import {Router} from '@angular/router';
@Injectable()
export class ModulesService extends BaseService {
    constructor() {
        super('/modules', 'Manufacturer Saved!', '/modules', false, HttpClient, ToastrService, Router);
    }
}

我有什么不明白的？提前谢谢你！

Answer 1

缺少指定类型。如果您指定，那么它将工作。

BaseService的代码如下。

import {EventEmitter, Output} from '@angular/core';
import { environment } from '../../environments/environment';
import { HttpClient } from '@angular/common/http';
import { Router } from '@angular/router';
import {ToastrService} from 'ngx-toastr';
export abstract class BaseService {
    @Output() saving = new EventEmitter();
    constructor(
        public api_url: string,
        public success_message: string,
        public success_url: string,
        public nav_to_view: boolean,
        public http: HttpClient,
        public toaster: ToastrService,
        public router: Router
    ) {
        this.api_url = environment.api + this.api_url;
    }

    list() {
        return this.http.get(this.api_url);
    }
}

ModulesService的代码如下。

import {Injectable} from '@angular/core';
import {BaseService} from '../../core/base.service';
import {HttpClient} from '@angular/common/http';
import {ToastrService} from 'ngx-toastr';
import {Router} from '@angular/router';
@Injectable()
export class ModulesService extends BaseService {
    constructor(public http: HttpClient,
        public toaster: Toaster,
        public router: Router) {
        super('/modules', 'Manufacturer Saved!', '/modules', false, http, toaster, router);
    }
}