我是一个非常基本的应用程序。我只是试图获得一个登录表单来填充,但我得到了这个神秘的错误,没有别的东西可以继续
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>
在上面的表单中,我的IDE也说这里不允许(submit)
和[(ngModel)]
。我不确定我在这里缺少什么。
----------------------------- Update 1 ---------------- ---------
我添加了这个:
@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'.
--------------------------- update 2 ------------------ ---------
项目在GIT上
答案 0 :(得分:0)
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]
})