displaying JSON onto Html - Angular 4 - html

I have JSON data that I can read and access in console. I need to read onto Html. But it looks like I can't read. I get an error saying that cannot read property of NewDataSet. Anyone has ideas? I am not sure if data is returning from mpa function to subscribe.
html
<div>{{results.NewDataSet.Table[0]}}</div>
**sample data when returning res in service.ts **

Try this :
<div>{{results?.NewDataSet?.Table[0] | json}}</div>
Instead of
<div>{{results.NewDataSet.Table[0]}}</div>

your html page will rendered before your data populates by rest call response.
in that scenario your results variable is empty array without NewDataSet
results: any [];
so declare as object and create array as element of that object
results: any = { NewDataSet : {
Table : []
}
};
Change your declaration like this.

Related

Why I Can't Write Objects in <li> Tag

When I writing my JSON data to HTML tag it's writing but don't write object. It's write [object Object]:
○Data1 ○wash dishes ○[object Object]
○find some break ○[object Object]
I'm trying to do lists with pointing JSON database but it's looks like that. I'm calling my JSON with that code:
var db_note = objpick(data);
db_note.date.forEach(function(element) {
tabledatednote.insertAdjacentHTML( 'beforeend',"<li>" + element + " </li>");
/* I just writed to this part because is just changing "no_date.>date<" part while displaying other JSONs */
});
objpick.js is an external file
function objpick(data){
for(i in data){ var result = data[i] }
return result
};
and there is my JSON database
{
"nodate": ["wash dishes", "find some bread"],
"date": [{"01/01/2077" : "Cyberpunk Meet"}, {"25/05/2005" : "Buney?"}],
"bookmark" : ["Data1"]
}
Ultimately what's being displayed is a string. So the code converts whatever you want to display to a string. For simple values, this conversion is easy. It's consistent and obvious what the resulting string is for a single value.
But objects are not simple values. They are potentially complex. And unless otherwise defined on your object(s), the default string representation for an object is: [object Object]
Some of the things you are display are values:
"find some bread"
But some of them are objects:
{"25/05/2005" : "Buney?"}
For the objects, you'd need to tell the code how to display it. Some options I can think of are:
Manually. For example, check if a certain property exists on the object and, if it does, display that property's value.
JSON-encode the object and display the resulting JSON string.
Override .toString() on your object(s).
Which you choose is up to you, and for the same reason that you're seeing the current default behavior... Because only you know how you want/expect that object to be displayed.

Array to string conversion in EasyAdmin 3 (Symfony 5)

I'm trying to display a json array on the EasyAdmin detail page. I read here Is there a way to represent a JSON field in EasyAdmin 3? that you can use ArrayField in EasyAdmin 3 to display a json array, which would make sense to me as that is the only field in EasyAdmin that could display it so I added it like this:
public function configureFields(string $pageName): iterable
{
return [
ArrayField::new('status', $this->translator->trans('form.label.status'))->onlyOnDetail(),
];
}
But it gives me this error:
An exception has been thrown during the rendering of a template ("Notice: Array to string conversion"). Do I need to add something else to it or does it not work at all?
change "status" to a multiplicity "statuses"
Worked for me with changing "print" to "prints"
I found a workaround that resolved the issue in my situation where I wanted just to show JSON on details page
So in your entity add a get function as an unmapped field as indicated in the official documentaiton
https://symfony.com/bundles/EasyAdminBundle/current/fields.html#unmapped-fields
for example
public function getJsonField() {
return json_encode($this->yourEntityJsonAttribute);
}
then in configureFields function in your CrudController add your field like this
TextAreaField::new('jsonField')->onlyOnDetail()
You can also read the json attribute and generate an HTML string in the getJsonField function then in configure field just add renderAsHtml in th field like this
TextAreaField::new('jsonField')->onlyOnDetail()->renderAsHtml()
Wish this suits your case too, Good luck

How to print an object as JSON to console in Angular2?

I'm using a service to load my form data into an array in my angular2 app.
The data is stored like this:
arr = []
arr.push({title:name})
When I do a console.log(arr), it is shown as Object. What I need is to see it
as [ { 'title':name } ]. How can I achieve that?
you may use below,
JSON.stringify({ data: arr}, null, 4);
this will nicely format your data with indentation.
To print out readable information. You can use console.table() which is much easier to read than JSON:
console.table(data);
This function takes one mandatory argument data, which must be an array or an object, and one additional optional parameter columns.
It logs data as a table. Each element in the array (or enumerable property if data is an object) will be a row in the table
Example:
first convert your JSON string to Object using .parse() method and then you can print it in console using console.table('parsed sring goes here').
e.g.
const data = JSON.parse(jsonString);
console.table(data);
Please try using the JSON Pipe operator in the HTML file. As the JSON info was needed only for debugging purposes, this method was suitable for me. Sample given below:
<p>{{arr | json}}</p>
You could log each element of the array separately
arr.forEach(function(e){console.log(e)});
Since your array has just one element, this is the same as logging {'title':name}
you can print any object
console.log(this.anyObject);
when you write
console.log('any object' + this.anyObject);
this will print
any object [object Object]

Display JSON Object from console

I have a JSON object returned in my console, and I want to display those data named "offers".
the JSON object is returned like that :
I tried to display my JSON Object data with :
console.log(JSON.stringify(data));
The thing is, it says that "data is not defined"
Does anyone know what happens ? :)
You should add full path to element of json, for example if your json looks like:
var json = {"par":22, "par2":555, "elems":[{"attr1":53, "attr2":99}] };
and if you want to get attr1 value, you should do something like this:
console.log(json.elems[0].attr1); // 53
so in your case that could be something like:
variableName.result.data.offers //variableName is variable that your "consoling"
Method JSON.stringify doesn't get yout specified value from JSON structure, it's converts JSON object to string.
console.dir provides a good representation of object than console.log().U can try with both
console.log(result.data.offers[0]);
console.dir(result.data.offers[0]);

Could not retrieve json data from the given format

this is my json format
({"message":{"success":true,"result":[{"lead_no":"LEA13","lastname":"Developer","firstname":"PHP","company":"Dummies","email":"nandhajj#gmail.com","id":"10x132"},{"lead_no":"LEA14","lastname":"Venu","firstname":"Yatagiri","company":"Rsalesarm","email":"veve#jajs.com","id":"10x133"},{"lead_no":"LEA4","lastname":"Jones","firstname":"Barbara","company":"Vtigercrm inc","email":"barbara_jones#company.com","id":"10x35"},{"lead_no":"LEA1","lastname":"Smith","firstname":"Mary","company":"Vtiger","email":"mary_smith#company.com","id":"10x32"}]}})
i am trying to retrieve the whole json result values using the following snippet
if (xmlHttp.readyState==4)
{
alert(xmlHttp.status);
if(xmlHttp.status==200)
{
alert("hi");
var jsondata=eval("("+xmlHttp.responseText+")") //retrieve result as an JavaScript object
jsonOutput=jsondata.result;
alert(jsonOutput);
InitializeLeadStorage()
}
}
my alert (hi ) is displayed but the alert(jsonOutput); is undefined , please help me if you could find any mistake
jsonOutput = jsondata.message.result;
result lives on message - it is not a top-level item in the JSON. With things like this, console.log() the JSON and you can check the path to the bit you want.
Also
your variable is global
there are better ways of parsing your JSON. If you don't care about old IEs, you can use the ECMA5 JSON.parse(), else use jQuery or another third-party utility for this