I've been trying to display some data from a web service with no luck
I tried this
ngOnInit(){
//console.log(this._productoService.getDeudas());
this._productoService.getDeudas().subscribe(
result =>{
console.log(result.Cuotas);
}
);
}
}
and i got this error
Property 'Cuotas' does not exist on type 'Response'.
this is the data i got in the console
any ideas? thanks in advance
Response is an object and therefore you can use...
result => { result ['Cuotas']; }
... the [result ['Cuotas']] field access stands out because you use bracket notation to access the results field. If you tried to write [result.Cuotas], TypeScript would correctly complain that the Object coming back from HTTP does not have a results property. That's because while HttpClient parsed the JSON response into an Object, it doesn't know what shape that object is.
https://angular.io/guide/http
Related
I am trying to receive a MongoDB document from my database through a get request. I have tested the URL via Postman and is returning the document as expected. This has made me aware that the issue is in the frontend and not the Server.
When I do the same via my frontend, it retrieves the data, and is stored in the variable res and assigned to this.englishteam so it can be accessed outside the function scope of GetSingleEnglishTeam.
public teamenglish!:EnglishTeam;
GetSingleEnglishTeam(_id: string) {
this.englishTeamService.GetSingleEnglishTeam(_id).subscribe((res)=>{
console.log("The team: "+ res);
this.teamenglish = res;
// console.log(this.teamenglish);
})
}
However, when I try to access the ClubName stored in teamenglish I get an undefined error
ERROR TypeError: Cannot read property 'ClubName' of undefined
at ClubHonoursComponent_Template (club-honours.component.html:9)
Club-honours.component.html
<div class="row">
<div class="column">
<div class="PremierLeagues" >
{{teamenglish.ClubName}}
</div>
</div>
Get Request to the Server
GetSingleEnglishTeam(_id: string){
console.log( "ID is "+_id);
return this.http.get<EnglishTeam>('http://localhost:3000/api/getTeamEn/' + `${_id}`);
}
When I console log the variable containing the JSON object I get [Object Object].
What I want to do is be able to send a getOne request to the server and the server to return the single document. Can anyone see where I have gone wrong?
The problem is that the template is initialised before teamenglish variable could be set in callback of subscribe.
You can solve this by 3 methods -
1.) In your template file use Safe navigation operator (?) i.e. -
{{teamenglish?.ClubName}}
2.) Use *ngIf on container div to only render itself if teamenglish is available to use (which will be available to use once your observable callback sets it to teamenglish i.e. -
<div *ngIf="teamenglish" class="PremierLeagues" >
{{teamenglish.ClubName}}
</div>
3.) Use async pipe in your template to automatically handle the subscription and value resolution i.e.
In your ts file, assign the observale to a variable like -
const obs = this.englishTeamService.GetSingleEnglishTeam(_id)
Then in your template file -
{{obs | async | json}}
I'm trying some basic API Connect tutorials on IBM's platform (running locally using loopback) and have got completely stuck at an early point.
I've built a basic API service with some in-memory data and setter / getter functions. I've then built a separate API which takes two GET parameters and uses one of my getter functions to perform a search based on two criteria. When I run it, I successfully get a response with the following JSON object:
[{"itemId":1,"charge":9,"itemSize":2,"id":2}]
I've then tried to add a piece of server logic that modifies the response data - at this point, I'm just trying to add an extra field. I've added a Javascript component in the Assemble view and included the following code (taken from a tutorial), which I thought should modify the message body returned by the API while still passing it through:
//APIC: get the payload
var json = apim.getvariable('message.body');
//console.error("json %s", JSON.stringify(json));
//same: code to inject new attribute
json.platform = 'Powered by IBM API Connect';
//APIC: set the payload
//message.body = json;
apim.setvariable('message.body', json);
Instead of getting an extra JSON parameter ("platform"), all I get is a 500 error when I call the service. I'm guessing that I'm doing something fundamentally wrong, but all the docs suggest these are the right variable names to use.
You can't access json.platform but at that point json variable is json type. Are you sure that you can add a property to a json type variable if your json object lacks of that property? I mean: What if you first parse the json variable of json type to a normal object, then add new property, and finally stringify to json type again for body assigning purposes?
var json = JSON.parse(apim.getvariable('message.body')); //convert to normal object
json.platform = 'Powered by IBM API Connect'; //add new property
apim.setvariable('message.body', JSON.stringify(json)); //convert to json again before setting as body value
You need to get the context in some determined format, and in this function do your logic. For example if your message is in json you need to do:
apim.readInputAsJSON(function (error, json) {
if (error)
{
// handle error
apim.error('MyError', 500, 'Internal Error', 'Some error message');
}
else
{
//APIC: get the payload
var json = apim.getvariable('message.body');
//console.error("json %s", JSON.stringify(json));
if(json){
//same: code to inject new attribute
json.platform = 'Powered by IBM API Connect';
//APIC: set the payload
//message.body = json;
apim.setvariable('message.body', json);
}
}
});
Reference:
IBM Reference
You have the message.body empty, put a invoke/proxy policy before your gateway/javascript policy for example.
Initially the content from the server was JSON data.And I was able to access the data perfectly.
{ "status":"ok", "artifact":"weblayer-war", "version":"0.0.41-test-data", "buildtime":"test-data" }
Now the response from the server has been changed to json data + text data.
{ "status":"ok", "artifact":"weblayer-war", "version":"0.0.41-test-data", "buildtime":"test-data" }
Properties for service:
=======================
ServiceEndpoint: https://somedomain:1200/web/Servlet/SOAP/Services
Certificates: false
DocumentName: note.pdf
So whether changing the content-type to application-text and using split method is the only way we can solve this or Is there any better approach?
As mentioned in the comments, mixing JSON and pure text data is wrong (as it defeats the advantage of using standardized data format) and should be avoided. Maybe that is some kind of debug log that was accidentally included in the production code?
If not, you should read just the first line of response and parse it as JSON data, ignoring the rest, hoping for no more changes in response structure ;)
You really should overthink your API design.
What about adding the text part as part of your JSON?
{
... // your JSON properties here
"serviceProperties": { // properties for service
"ServiceEndpoint": "https://somedomain:1200/web/Servlet/SOAP/Services",
"Certificates": false,
"DocumentName": "note.pdf"
}
}
I am trying to interrogate an API response from the Recognize (fashion recognition) API. The data is returned as set out below. I am trying to extract the items of attire from the following object.
Object {data: " Array↵(↵ [id] => 1309↵)↵{"Status":true,"Data":{"VufindTags":["Dress"," Purse"]}}", status: 200, headers: function, config: Object, statusText: "OK"}config: Objectdata: " Array↵(↵ [id] => 1309↵)↵{"Status":true,"Data":{"VufindTags":["Dress"," Purse"]}}"headers: function (name) {status: 200statusText: "OK"__proto__: Object
I have tried to access using data.data which returned the following as a string:
" Array
(
[id] => 1309
)
{"Status":true,"Data":{"VufindTags":["Dress"," Purse"]}}"
I then tried to use JSON.parse to extract the data from the VufindTags. That did not work.
Is there a way to convert this into a JSON Object??
Thanks for any help!!
It looks like the vufind API is giving you PHP print_r output instead of JSON. The best thing to do would be to get them to fix their API. Failing that, you can pull the JSON-ified bits out. I had some success with this:
myObj = JSON.parse(apiOutput.slice(apiOutput.indexOf('{')))
...but I wouldn't put that into an app and call it production ready, especially when the API clearly isn't giving you what it should in the first place.
In the following JSON how to access id and name
console.log($scope.mylist)
{"data":"{\"projects\":[{\"id\":\"3\",\"title\":\"MYCLOUD\",\"desc\":\"DESC\"}]}"}
I tried the following
console.log($scope.mylist.data) //undefined
console.log($scope.mylist["data"])//undefined
console.log($scope.mylist.projects)//undefined
console.log($scope.mylist["projects"]) //undefined
Your data property contains JSON, so you need to JSON.parse that too.
$scope.mylist.data.projects = JSON.parse($scope.mylist.data);
Then you should be able to access it with
$scope.mylist.data.projects[0].id //etc
Though there's an underlying problem of how you're getting/sending that JSON.