“事件”类型不能分配给“字符串”类型。角度打字稿错误

时间:2021-03-11 14:47:26

标签: angular typescript

我对 Angular 很陌生,遇到了打字稿问题。

这是我得到的错误:

Error: contact/contact.component.html:70:37 - error TS2322: Type 'Event' is not assignable to type 'string'.
     <mat-radio-group [(value)]="contactGender">
     <mat-radio-button value="male">Male</mat-radio-button>

contact/contact.component.ts:6:16
      templateUrl: './contact.component.html',

我的 HTML 组件部分出现错误:

    <mat-label>Gender</mat-label>
    <mat-radio-group [(value)]="contactGender">
        <mat-radio-button value="male">Male</mat-radio-button>
        <mat-radio-button value="female">Female</mat-radio-button>
    </mat-radio-group>

我的 TS 组件:

import { Component} from '@angular/core';
import { FormControl } from '@angular/forms';
import {MatDatepickerModule} from '@angular/material/datepicker';

@Component({
  selector: 'app-contact',
  templateUrl: './contact.component.html',
  styleUrls: ['./contact.component.css']
})


export class ContactComponent {
  date = new FormControl(new Date());
  serializedDate = new FormControl((new Date()).toISOString());

  contactGender:  string   =  "female";

    public  saveContact(){
      /* Typically this method will be used to send the contact form to a server to save it*/
    }
    constructor() { }

}

我哪里出错了?

1 个答案:

答案 0 :(得分:2)

更改导致此错误的 HTML 组件。这里我们使用 ngModel 而不是值绑定变量,并使用 []

将属性绑定放在值上
 <mat-label>Gender</mat-label>
    <mat-radio-group [(ngModel)]="contactGender">
        <mat-radio-button [value]="male">Male</mat-radio-button>
        <mat-radio-button [value]="female">Female</mat-radio-button>
    </mat-radio-group>