Angular TypeScript错误-类型“ number”不可分配给类型“ any []”

时间:2019-12-26 20:20:02

标签: angular typescript

我的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;
        });
  }

}

任何帮助将不胜感激。

1 个答案:

答案 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