Typescript Type X is missing the following properties from type Y length pop push concat and 26 more 2740

Question

I have this Product interface  export interface Product    code  string    description  string    type  string     Service with method calling product endpoint    public getProducts    Observable lt Product gt        return this http get lt Product gt   api products v1             And component where I use this service to get the Products  export class ShopComponent implements OnInit       public productsArray  Product             ngOnInit             this productService getProducts   subscribe res   gt              this productsArray   res                       With this state I m getting error    ts  Type  Product  is missing the following properties from type  Product     length  pop  push  concat  and 26 more   2740   Removing typing on productsArray variable removes the error  but don t get why this is not working  since server response is an array of objects in the type of Products

User · Answer

I had the same problem and I solved as follows define an interface like mine

export class Notification {
    id: number;
    heading: string;
    link: string;
}

and in nofificationService write

allNotifications: Notification[]; 
  //NotificationDetail: Notification;  
  private notificationsUrl = 'assets/data/notification.json';  // URL to web api 
  private downloadsUrl = 'assets/data/download.json';  // URL to web api 

  constructor(private httpClient: HttpClient ) { }

  getNotifications(): Observable<Notification[]> {    
       //return this.allNotifications = this.NotificationDetail.slice(0);  
     return this.httpClient.get<Notification[]>

(this.notificationsUrl).pipe(map(res => this.allNotifications = res))
      }

and in component write

 constructor(private notificationService: NotificationService) {
   }

  ngOnInit() {
      /* get Notifications */
      this.notificationService.getNotifications().subscribe(data => this.notifications = data);
}

User · Answer

For me the error was caused by wrong type hint of url string  I used  export class TodoService      apiUrl  String    https   jsonplaceholder typicode com todos     wrong uppercase String    constructor private httpClient  HttpClient         getTodos    Observable lt Todo   gt        return this httpClient get lt Todo   gt  this apiUrl         where I should have used export class TodoService      apiUrl  string    https   jsonplaceholder typicode com todos     lowercase string     constructor private httpClient  HttpClient         getTodos    Observable lt Todo   gt        return this httpClient get lt Todo   gt  this apiUrl

User · Answer

You are returning Observable lt Product gt  and expecting it to be Product   inside subscribe callback   The Type returned from http get   and getProducts   should be Observable lt Product   gt   public getProducts    Observable lt Product   gt        return this http get lt Product   gt   api products v1

User · Answer

This error could also be because you are not subscribing to the Observable  Example  instead of  this products   this productService getProducts     do this     this productService getProducts   subscribe       next  products  gt this products   products      error  err  gt this errorMessage   err

User · Answer

You must specify which type the response is   this productService getProducts   subscribe res   gt              this productsArray   res               Try this   this productService getProducts   subscribe  res  Product      gt              this productsArray   res

User · Answer

You have forgotten to mark the getProducts return type as an array  In your getProducts it says that it will return a single product  So change it to this   public getProducts    Observable lt Product   gt        return this http get lt Product   gt   api products v1

User · Answer

I got the same error message on GraphQL mutation input object then I found the problem  Actually in my case mutation expecting an object array as input but I m trying to insert a single object as input  For example  First try const mutationName   await apolloClient mutate lt insert mutation  insert mutationVariables gt          mutation  MUTATION        variables            objects   id  1  name   quot John Doe quot                      Corrected mutation call as an array const mutationName   await apolloClient mutate lt insert mutation  insert mutationVariables gt          mutation  MUTATION        variables            objects    id  1  name   quot John Doe quot                       Sometimes simple mistakes like this can cause the problems  Hope this ll help someone

User · Answer

For those newbies like me  don t assign variable to service response  meaning do  export class ShopComponent implements OnInit     public productsArray  Product       ngOnInit           this productService getProducts   subscribe res   gt            this productsArray   res                    Instead of  export class ShopComponent implements OnInit       public productsArray  Product         ngOnInit             this productsArray   this productService getProducts   subscribe

[angular] Typescript: Type X is missing the following properties from type Y length, pop, push, concat, and 26 more. [2740]

Examples related to angular

Examples related to typescript

Examples related to typescript-typings