我的Angular组件中的类型有问题。我有一个从输入获取值并将数据发送到服务器的表单。我希望数据的类型为specs: string[]
,但是编译器向我抛出错误:
类型'number'不能分配给类型'any []'
Howewer,如果我将其更改为specs = []
,则效果很好。我搜索了Angular和TypeScript文档进行解释,但没有找到解决我问题的答案。
这是我的HTML组件:
<div class="container list-group" [formGroup]="specForm" (ngSubmit)="setSpec()">
<div class="list-group-item information">
Speciality: <a href="#" class="header-picture"><img src="assets/static/img/edit.png" alt=""></a>
</div>
<div class="list-group-item info-field-list">
<div class="info-field-name">
<p>Sector:</p>
</div>
<div class="info-field-value" *ngFor="let user of users;let i=index">
<div class="info-field-value">
<a class="url"> {{user.speciality}} </a> (3lvl)
</div>
</div>
<div class="info-field-value">
<input type="text" class="spec-input" formControlName="speciality" placeholder="Write text"><span
class="icon icon-plus" (click)="setSpec()"></span>
</div>
</div>
</div>
和TS文件:
import { Component, OnInit, Input } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { AuthenticationService } from '@services/auth.service';
@Component({
selector: 'app-speciality',
templateUrl: './speciality.component.html',
styleUrls: ['./speciality.component.css']
})
export class SpecialityComponent implements OnInit {
@Input() user;
specs: string[];
specForm: FormGroup;
submitted = false;
loading = false;
constructor(private formBuilder: FormBuilder, private authService: AuthenticationService) { }
ngOnInit() {
this.specForm = this.formBuilder.group({
speciality: ['']
});
this.authService.getUser().subscribe(
(data) => {
//this.specs = data.speciality;
});
}
get s() { return this.specForm.controls; }
setSpec() {
// activating submission flag for patch function
console.log(this.specs)
let newSpec = this.specs.push(this.s.speciality.value)
this.submitted = true;
console.log(this.specs)
if (!this.specForm.valid) {
return
}
this.authService
// sending values to auth service function
.specAdd(newSpec)
.subscribe(
(data) => {
this.submitted = false;
},
error => {
this.loading = false;
});
}
}
任何帮助将不胜感激。
答案 0 :(得分:1)
问题在于您正在将Array.push结果分配给数组,Array.push返回一个数字,该数字显示了数组长度,只是在第一次推送到数组然后将数组分配给新数组的时候:
let newSpec = this.specs.push(this.s.speciality.value)
应为:
this.specs.push(this.s.speciality.value)
let newSpec = this.specs