Warning: file_get_contents(/data/phpspider/zhask/data//catemap/5/date/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angular 强制角度与json中的接口类型有关_Angular_Typescript_Validation - Fatal编程技术网

Angular 强制角度与json中的接口类型有关

Angular 强制角度与json中的接口类型有关,angular,typescript,validation,Angular,Typescript,Validation,例如: model.ts export interface Item{ name: string; age: string } form: FormGroup constructor(private fb: FormBuilder){} onInit(){ this.form = fb.group({ name: [''], age: [''] }) } exampleFn(){ const signature: Item = Object.assign({

例如:

model.ts

export interface Item{
  name: string;
  age: string
}
form: FormGroup

constructor(private fb: FormBuilder){}

onInit(){
  this.form = fb.group({
    name: [''],
    age: ['']
})
}
exampleFn(){
  const signature: Item = Object.assign({},this.form.value);

  console.log(typeof(signature.age)); // <=== HERE
  // output number

}
组件。ts

export interface Item{
  name: string;
  age: string
}
form: FormGroup

constructor(private fb: FormBuilder){}

onInit(){
  this.form = fb.group({
    name: [''],
    age: ['']
})
}
exampleFn(){
  const signature: Item = Object.assign({},this.form.value);

  console.log(typeof(signature.age)); // <=== HERE
  // output number

}
form:FormGroup
构造函数(私有fb:FormBuilder){}
onInit(){
this.form=fb.group({
姓名:[''],
年龄:['']
})
}
例fn(){
常量签名:Item=Object.assign({},this.form.value);

console.log(typeof(signature.age));//该值不是字符串,因为您的输入设置为
type=“number”

Typescript只是Javascript的超集,您的界面不存在。一旦您的所有代码都传输到JS,将
form.value
(根据[docs][1]是
any
类型)分配给强类型变量将不会尝试将每个属性值转换或强制转换为特定类型

采用以下类型脚本:

//declare strongly typed interface
interface Item {
  name: string;
  age: string
};

//create a value of type any, which is essentially what "formGroup.value" is
const myFormValue: any = {
    name: '',
    age: '' //it's a string!
};

//set the value to a number, as what happens when someone interacts with your number input
myFormValue.age = 42;

//Assign and cast "myFormValue" as an "Item"
//This will not implicitly try to convert values for you
const formValueAsItem: Item = myFormValue;

console.log(formValueAsItem);
现在,我们来看看当它归结为JS时是什么样子:

//create a value of type any, which is essentially what "formGroup.value" is
const myFormValue = {
    name: '',
    age: '' //it's a string!
};

//set the value to a number, as what happens when someone interacts with your number input
myFormValue.age = 42;

//There's no type here, we're simply creating a new variable and assigning it a value.
const formValueAsItem = myFormValue;

console.log(formValueAsItem);

另一个答案是100%正确,您想做的事情应该在其他地方的映射函数中完成,但您仍然可以使用只允许数字的

使用链接中的指令,html将如下所示:

<form *ngIf="form" [formGroup]="form">
  <input formControlName="name" type="text"/>
  <input formControlName="age" numbersOnly/>
</form>


我不是编写指令的人,我仍然认为你应该找到另一种方法。

是的,输入类型是数字,但我需要将其作为字符串发送到json对象内部。但是,不需要单独解析,因为这里是一个简单的示例,有两个属性,在实际情况下,我有100多个属性,可以更多。但是我不知道如何输入数字。对不起,我误解了你的问题。不,你不能仅仅通过使用接口就让它输出字符串。你需要手动转换它。typescript上的类型只是编码过程中的一个助手,但它们不会在构建的代码上持久存在。谢谢Elias,我会手动解析的。好吧,我肯定是mod艾尔会做的,但不会。谢谢你的解释,我明白了。