Property 'includes' is missing in type 'Subscription'

1

I want to map the list of questions and throw them in the questions property of my JSON object, but at the prompt gives this error:

  

"ERROR in src / app / form / questions / questions.component.ts (19,5): error   TS2322: Type 'Subscription' is not assignable to type 'Question []'.
  Property 'includes' is missing in type 'Subscription'. "

This is my questions component:

import { Component, OnInit } from '@angular/core';

import { Pergunta } from '../perguntas/pergunta.model'
import { PerguntasService } from '../perguntas.service'

@Component({
  selector: 'app-perguntas',
  templateUrl: './perguntas.component.html',
  styleUrls: ['./perguntas.component.css']
})
export class PerguntasComponent implements OnInit {

  perguntas: Pergunta[]

  constructor(private perguntasService: PerguntasService) { }
 //ass
  ngOnInit() {
    this.perguntas = this.perguntasService.perguntas()
        .subscribe(perguntas => this.perguntas = perguntas)
  }

}

Here is my service:

import { Injectable } from '@angular/core';
import { Pergunta } from './perguntas/pergunta.model'
import { PerguntasComponent } from './perguntas/perguntas.component'
import { Http} from '@angular/http'
import {Observable} from 'rxjs/Observable'
import 'rxjs/add/operator/map'
import { MEAT_API} from '../app.api'

@Injectable()
export class PerguntasService{

  constructor(private http:Http){}




    perguntas(): Observable<Pergunta[]>{
      return this.http.get('${MEAT_API}/perguntas')
      .map( response => response.json())
    }



}

and my app modules:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpModule } from '@angular/http';
import { RouterModule } from '@angular/router';
import { ModalModule } from 'ngx-bootstrap/modal';
import { FormsModule } from '@angular/forms';
import { ROUTES } from './app.routes';


import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { FormComponent } from './form/form.component';
import { PerguntasComponent } from './form/perguntas/perguntas.component';
import { OpcoesComponent } from './form/perguntas/opcoes/opcoes.component';
import { PerguntasService } from './form/perguntas.service';



@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    FormComponent,
    PerguntasComponent,
    OpcoesComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
     HttpModule,
    RouterModule.forRoot(ROUTES),
    ModalModule.forRoot()
  ],
  providers: [PerguntasService],
  bootstrap: [AppComponent]
})
export class AppModule { }
    
asked by anonymous 11.03.2018 / 22:54

1 answer

1

Your problem is that you are trying to assign the subscribe result to your list of Pergunta , when the value is already applied within the first callback .

Therefore, make the following modification:

preguntas.component.ts

ngOnInit() {
    this.perguntaService
        .perguntas()
        .subscribe(perguntas => this.perguntas = perguntas);
}
    
12.03.2018 / 11:49