错误:无法解析TypeDecorator的所有参数: Angular 2 RC-6

Question

我是一个非常基础的应用程序。我只是试图获得一个登录表单来填充，但我得到了这个神秘的错误，没有其他东西继续下去

Error: Can't resolve all parameters for TypeDecorator:

main.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app.module';

platformBrowserDynamic().bootstrapModule(AppModule);

app.module.ts

import {NgModule} from "@angular/core";
import {BrowserModule} from "@angular/platform-browser";
import {AppComponent} from "./app.component";
import {FormsModule} from "@angular/forms";
import {LoginComponent} from "./Login/login";

@NgModule({
    imports: [BrowserModule, FormsModule],

    declarations: [AppComponent,
        LoginComponent],

    bootstrap: [AppComponent]
})
export class AppModule {

}

app.component.ts

import { Component } from '@angular/core';

@Component({
    selector: 'my-app',
    template: '<login></login>'
})
export class AppComponent {

}

login.ts

@Component({
    moduleId: module.id,
    selector: 'login',
    templateUrl:'./login.html',

    providers:[
        LoginService
    ]
})

export class LoginComponent{

    login: LoginModel = new LoginModel();

    constructor(private loginService:LoginService){

    }

    onSubmit() {
        this.loginService.output();
    }
}

loginService.ts

@Injectable
export class LoginService {

    output(){
        console.log("You are in the service output class...")
    }
}

LoginModel.ts

export class LoginModel{

    private userName: string;
    private password: string;

    constructor(userName: string='', password: string=''){
        this.userName = userName;
        this.password = password;
    }

}

login.html

<div>
    <h2><strong>Login</strong></h2>

    <form (submit)="onSubmit()" class="form-horizontal">

        <div class="form-group">
            <label class="col-sm-2 control-label">First Name:</label>
            <div class="col-sm-10">
                <input type="text" name="firstName" [(ngModel)]="login.firstName" placeholder="First name" required="required">
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label">Last Name:</label>

            <div class="col-sm-10">
                <input type="password" name="lastName" [(ngModel)]="login.password" placeholder="password" required="required">
            </div>
        </div>

        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" class="btn btn-info">Submit</button>
            </div>
        </div>

    </form>
</div>

在上面的形式中，我的集成开发环境也说明这里不允许使用(submit)，也不允许使用[(ngModel)]。我不确定我在这里遗漏了什么。

我添加以下内容：

@NgModule({
    imports: [BrowserModule, FormsModule],

    declarations: [AppComponent,
        LoginComponent],

    providors:[LoginService], <---- Added this

    bootstrap: [AppComponent]
})
export class AppModule {

}

不，当我这样做的时候，它只给了我以下错误：

`12:14:14 - File change detected. Starting incremental compilation...
[0] app/Login/login.service.ts(5,1): error TS1238: Unable to resolve signature of class decorator when called as an expression.
[0]   Supplied parameters do not match any signature of call target.
[0] app/app.module.ts(14,5): error TS2345: Argument of type '{ imports: typeof BrowserModule[]; declarations: (typeof AppComponent | typeof LoginComponent)[];...' is not assignable to parameter of type 'NgModuleMetadataType'.
[0]   Object literal may only specify known properties, and 'providors' does not exist in type 'NgModuleMetadataType'.

项目在GIT上

GitHub Link

Answer 1

import {LoginService} from 'valid path';

@NgModule({
    imports: [BrowserModule, FormsModule],

    declarations: [AppComponent,LoginComponent],

    providers:[LoginService]        //<------added here and remove from login.ts. Don't forget to import LoginService again in login.ts file.        

    bootstrap: [AppComponent]
})