Good afternoon, I have a problem when I want to return an array of objects from an external function.
I have declared an Object class with 2 properties, its constructor and one that works where I return an array with more than 50 objects for this example I only put 4 objects
export class Object {
formcontrolName: String;
formcontrolTraducido: String;
constructor(formcontrolName: String, formcontrolTraducido: String) {
this.formcontrolName = formcontrolName;
this.formcontrolTraducido = formcontrolTraducido;
}
getData() {
return [
{ formcontrolName: 'callId', formcontrolTraducido: 'CId' },
{ formcontrolName: 'collegeCareerId', formcontrolTraducido: 'Carrera' },
{
formcontrolName: 'collegeDepartmentId',
formcontrolTraducido: 'Nombre del Departamento/Centro',
},
{
formcontrolName: 'detailedAreaKnowledgeId',
formcontrolTraducido: 'Campo Detallado',
},
];
}
}
The problem is that I want to call from another component the getData function of the Object class, but when returning I get the following error:
Type '() => { formcontrolName: string; formcontrolTraducido: string; }[]' is missing the following properties from type 'Object[]': pop, push, concat, join
import { Component, OnInit } from '@angular/core';
import { Object } from './object';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
})
export class AppComponent implements OnInit {
data: Object;
arrayData: Object[];
constructor() {}
ngOnInit() {
this.arrayData = this.data.getData;
console.log('arrayData: ' this.arrayData);
}
}
I am new to angular and to working with arrays, I would like to know what I can do to solve my problem. Thank you very much
CodePudding user response:
First of all the type for the property arrayData
is not of type Object which is the class that you're using, so a more proper type would be the same as the one that is returned by the method getData
.
You can get its return type by using the typescript helper type ReturnType
, so a good way to type this would be like:
arrayData: ReturnType<Object['getData']>;
One recommendation that I have is not to use the name Object
for a class, since it has the same name as Object
a javascript builtin.
After that the problem that you have here:
ngOnInit() {
this.arrayData = this.data.getData();
console.log('arrayData: ' this.arrayData);
}
Is that you are assigning a method to a variable that expects an array of something, that's why you get the error:
Type '() => { formcontrolName: string; formcontrolTraducido: string; }[]' is missing the following properties from type 'Object[]': pop, push, concat, join
You just need to call the method like:
this.arrayData = this.data.getData();
With that all in mind the final code would look like:
import { Component, OnInit } from '@angular/core';
import { Object } from './object';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
})
export class AppComponent implements OnInit {
name = 'Angular';
data: Object;
arrayData: ReturnType<Object['getData']>;
constructor() {}
ngOnInit() {
this.arrayData = this.data.getData();
console.log('arrayData: ' this.arrayData);
}
}