Question

我按照以下方式在登录类中调用服务：

service.ts：

import { Component, OnInit } from '@angular/core';
import { Http, RequestOptions, Headers  } from "@angular/http";
import { apimodel } from '../../_model/APImodel';
import Global = require('../../_utilities/constants/constants');
import { UserModel } from '../../_model/usermodel';
import 'rxjs/add/operator/toPromise';


export class services
{
    constructor(private http: Http){ }

    getLogin(model : UserModel)  {
        let headers = new Headers({ 'Content-Type': 'application/json; charset=utf-8' });
        let options = new RequestOptions({ headers: headers });
        return this.http.post(Global.BASE_URL + '/login', model, options)
                .toPromise().then(res=><apimodel>res.json()).catch(this.handleError);
    }

    private handleError(error:any) {
        // In a real world app, we might use a remote logging infrastructure
        // We'd also dig deeper into the error to get a better message
        let errMsg = (error.message) ? error.message :
            error.status ? `${error.status} - ${error.statusText}` : 'Server error';
        console.log("Error");
        console.error(error); // log to console instead
        return Promise.reject(errMsg);
    }
}

和 login.ts

import { Component, OnInit } from '@angular/core';
import { UserModel } from '../../_model/usermodel';
import { FormGroup, FormControl, Validators } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import Global = require('../../_utilities/constants/constants');
import {apimodel} from "../../_model/APImodel";
import { services } from '../../_utilities/services/services';


@Component({
    templateUrl: './_componant/login/login.html'
})

export class LoginComponent implements OnInit{
    model : UserModel = {id : 0, email : "", password : "", username : ""};
    myform : FormGroup;
    submitted : boolean = false;
    returnUrl : string;
    response : apimodel;

    constructor( private route: ActivatedRoute, private router: Router, private services : services){

    }
    ngOnInit(): void {
        this.myform = new FormGroup({
            username : new FormControl("", Validators.required),
            password : new FormControl("", Validators.required)
        })

        this.returnUrl = this.route.snapshot.queryParams['returnUrl'] || '/';
    }

    login(model : UserModel){
        this.submitted = true;
        if(this.myform.valid)
        {
            this.services.getLogin(model).then(result => console.log(result)).catch(error => console.log(error));
            //Call Web Service to login
            console.log(this.returnUrl);
            this.router.navigate([this.returnUrl]);
        }
    };
}

module.ts

@NgModule({
  imports: [BrowserModule, ReactiveFormsModule ,appRouterModule],
  declarations: [AppComponent, LoginComponent, RegistrationComponent],
  bootstrap:    [AppComponent],
  providers: [services]
})

错误：

（SystemJS）无法解析服务的所有参数

如果我从module.ts中删除提供程序，则会出现以下错误。

没有服务提供商

更新我已经添加了@Injectable（）：

@Injectable()
export class services
{

但我仍然收到错误：http://prntscr.com/hz3e3a

Answer 1

您缺少 @Injectable()

@Injectable()
export class services{

无法在Angular 2中调用Promise

1 个答案: