typescript http client unable to parse boolean response

Question

HttpClient not parsing Boolean value

Service

 public isUSCustomer(): Observable<Boolean> {

  return this.httpClient
        .get<Boolean>(myurl);

}

Component

private isUScustomer: Boolean; 
this.myservice.isUSCustomer()
              .subscribe(x => {
                   this.isUScustomer = x;
                   console.log(this.isUScustomer); //Its undefined 
                   console.log(x); //it logs true.
});

Outputs

console.log(this.isUScustomer); undefined
console.log(x); //it logs true.
console.log(typeof x); boolean

I tried with Interface Boolean and boolean like this.

return this.httpClient
        .get<boolean>(myurl);

and

return this.httpClient
        .get<Boolean>(myurl);

Api Result

true

I read this Typescript boolean conversion but it was 2013.

Version Info

typescript: 2.4.2
Angular: 5.0.2

Well, it's strange. First don't use the interface, only use the primitive type. Could you try with `this.isUScustomer = x ? true : false;` ? — , Dec 14 '17 at 14:32

Deepak Jha · Accepted Answer · 2017-12-17T16:44:17.867

2

Well I had seen a same error few days back I stumbled upon something called eval function, that is how you can perhaps try this running,

private isUScustomer: Boolean; 
this.myservice.isUSCustomer()
              .subscribe(x => {
                   this.isUScustomer = eval(x);
});

Edit 1

TS look for return type and datatype for http calls, you can perhaps try to create an interface and give this a go. Let me show you how,

an Interface like this,

export interface booleanReturn{
    retData: boolean;
}

Import this in your service and use it as given below,

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { HttpBackend } from '@angular/common/http/src/backend';
import { booleanReturn } from '../interfaces/MyInterfaces';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class MyServiceService {

  constructor(private httpClient: HttpClient) { }

  getBoolean(): Observable<booleanReturn>{
    return this.httpClient.get<booleanReturn>('http://localhost:8080/getBoolean');
  }
}

Now in your component do something like this,

import { Component } from '@angular/core';
import { MyServiceService } from './my-service.service';
import { booleanReturn } from '../interfaces/MyInterfaces';

/*interface booleanReturn{
  retData: boolean
}*/
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';
  myObj ={"decision":'2==2'};
  private myBooleanVal : booleanReturn;
  constructor(private myService:MyServiceService){
    this.getBooleanValue();
  }
  myFunction(vwLog){
    //console.log(eval(vwLog),"Dj test");
    return eval(vwLog);
  }

  getBooleanValue(){
    this.myService.getBoolean().subscribe(x=>{
      this.myBooleanVal = x;
      console.log(x,"X Value");// this print true "X Value"
      console.log(this.myBooleanVal);// this prints "true"
    });
  }
}

see my screenshot below I can see the correct answer

edited Dec 17 '17 at 16:44

answered Dec 14 '17 at 14:50

Deepak Jha

1,539
12
17

Let me try it, but i have in service ask to evaluate get(url) . should it parse to a boolean – Eldho Dec 14 '17 at 14:53
yeh it should be but, give this a go, I was able to sort my problem of boolean using this. – Deepak Jha Dec 14 '17 at 14:54
In my case it was an error or string type and boolean type, somehow I think due to dynamic casting it was not working and accepting it as a string even when mentioned as boolean. – Deepak Jha Dec 14 '17 at 14:56
@Eldho any luck? – Deepak Jha Dec 15 '17 at 05:56
While using eval i get this file: severity: 'Error' message: 'Argument of type 'boolean' is not assignable to parameter of 'string' – Eldho Dec 17 '17 at 06:25
which means you are for sure getting a boolean date in your return type. Surprisingly I have tried to replicate your issue in my system and I am getting correct answers as expected with the same type of typescript and angular version. – Deepak Jha Dec 17 '17 at 16:01
check this documentation of TS it may help in understanding why it may be happening. Try implementing it through an interface, I am also trying the same. https://www.typescriptlang.org/docs/handbook/interfaces.html – Deepak Jha Dec 17 '17 at 16:28
can u provide the link – Eldho Dec 17 '17 at 16:30
I have tried another way of writing the return type using an interface, I am editing my answer above try that too if that works for you, in my case it does. – Deepak Jha Dec 17 '17 at 16:36
The feature has been removed, so the api is obsolete as of now. – Eldho Dec 17 '17 at 16:38
you have a point but I have seen this type of errors also, so give this a go look at my answer see if that helps you, this is kind of interesting to see how same configuration works in one computer and not in the other. – Deepak Jha Dec 17 '17 at 16:48
1

PLEASE don't do EVAL. Is considered harmful. – netalex Jan 14 '19 at 15:08

score 1 · Answer 2 · answered Dec 14 '17 at 15:28

1

I suspect that "this" is out of context when the subscribe happens.

Try adding your code into the constructor:

private isUScustomer: Boolean; 


constructor() {
  this.myservice.isUSCustomer()
              .subscribe(x => {
                   this.isUScustomer = x;
                   console.log(this.isUScustomer); //Its undefined 
                   console.log(x); //it logs true.
  });
}

answered Dec 14 '17 at 15:28

Steverob2k

445
8
11

I will try this but my im using different methods in the service in same manner with complex object it works fine. – Eldho Dec 14 '17 at 19:05

score 0 · Answer 3 · answered Dec 14 '17 at 15:43

0

use Let instead of private and return that variable

answered Dec 14 '17 at 15:43

Rohit Ramname

824
2
9
24

I dont think it because of private. Because i consume other services like the same with complex object which works fine. – Eldho Dec 14 '17 at 19:01

score 0 · Answer 4 · answered Dec 15 '17 at 13:15

0

If you are using Boolean type you have to initialize it with a default value before setting it .

private isUScustomer: Boolean = false;

Another alternative will be to use boolean type

private isUScustomer: boolean;

answered Dec 15 '17 at 13:15

cpr43

2,942
1
18
18

private isUScustomer: Boolean = false should have worked .. whats the final isUsCustomer value ; – cpr43 Dec 15 '17 at 18:20
But i havent set a value ; i just defined the property like isuscustomer:boolean; – Eldho Dec 15 '17 at 18:21

typescript http client unable to parse boolean response

4 Answers4