In my app.component.ts i created the array "data", which consists of a few strings separated by comma.
I parse it into json and with console.log i am able tto clearly present it the way i'd like to doing this:
const jsonData = Papa.parse(content, {skipEmptyLines: true,});
jsonData.data.forEach(function(data){
console.log(data[0], "|" , data[1] , "|" , data[2] , "|" , data[3]);
}
Its basically going through each line and then selecting the three data contents i'd like to be shown.
I want to display the array that way on my website in my app.component.html, but only the first three entries, because it has countless ones...
I've tried using the data as a json element
<td>{{data.entry1}}</td>
But i didn't succeed. Its quite a simple task but im really stuck here. Could anyone explain why I dont get it?
An easy way is to create an array that holds the data you would like to show.
ts
partialData = [];
yourFunction = () => {
:
jsonData.data.forEach(function(column) {
const line = [];
for (let i = 0; i < 4; i++) {
line.push(column[i]);
};
partialData.push(line);
});
}
html
<tr *ngFor="let line of partialData">
<td *ngFor="let column of line">
{{column}}
</td>
</tr>
Related
Om hopping fore your help.
Im trying to push objekt wihtin a nested json array.
The json-input looks like this:
"result":[{"MyEnergyData_MarketDocument":{"mRID":"8000cfdc-0000-f600-b63f-84710c7967bb","createdDateTime":"2022-11-03T08:15:18Z","sender_MarketParticipantname":"","sender_MarketParticipant.mRID":{"codingScheme":null,"name":null},"period.timeInterval":{"start":"2022-06-30T22:00:00Z","end":"2022-07-04T22:00:00Z"},"TimeSeries":[{"mRID":"571313181100574632","businessType":"A04","curveType":"A01","measurement_Unit.name":"KWH","MarketEvaluationPoint":{"mRID":{"codingScheme":"A10","name":"571313181100574632"}},"Period":[{"resolution":"PT1H","timeInterval":{"start":"2022-06-30T22:00:00Z","end":"2022-07-01T22:00:00Z"},"Point":[{"position":"1","out_Quantity.quantity":"0.489","out_Quantity.quality":"A04"},{"position":"2","out_Quantity.quantity":"7.57","out_Quantity.quality":"A04"},{"position":"3","out_Quantity.quantity":"0.131","out_Quantity.quality":"A04"}
The Google Script looks like this:
var meterdatajson = Utilities.jsonParse(meterdata);
var meterdataArray = meterdatajson['result'];
var arrayProperties = [];
meterdataArray.forEach(function(el) {
arrayProperties.push([el.???????],
);});
I tried everything, but cant g’et a hold on “start”, “position” and “out_Quantity.quintity”
I tried many different strings inside the function(el)
You need to navigate the nested objects. For example:
el.MyEnergyData_MarketDocument.TimeSeries[0].Period[0].Point[0].position
That would give you "1".
So your full loop would be something like this:
meterdataArray.forEach(function(el) {
arrayProperties.push(
el.MyEnergyData_MarketDocument.TimeSeries[0].Period[0].Point.map(p => [
p.position,
p.out_Quantity.quantity
])
);
});
That will give you an array of arrays of [position, quantity] pairs for the first TimeSeries/Period.
I have the following Google Chrome executeScript.
chrome.tabs.executeScript(
tabs[0].id,
{code: 'document.querySelectorAll(".col-9.col-md-10")[3].innerText'}, citationResult => {
console.log(citationResult);
});
This code gets the 4th element which has the classes col-9 AND `col-md-10' and then gets the inner text of that element. That is a string.
I would like a generalized query which instead returns every element which has col-9 AND `col-md-10'. However, when I try something like this:
chrome.tabs.executeScript(
tabs[0].id,
{code: 'document.querySelectorAll(".col-9.col-md-10")}, citationResult => {
console.log(citationResult);
});
I seem to get an empty array.
Is there a way to get those four elements returned rather than just getting the innerText of that single element?
As wOxxOm said, I needed to return an array of primitives. This is what solved my problem.
'var x = document.querySelectorAll(".col-9.col-md-10"); const finalArray = []; \n' +
'for (let i = 0; i < x.length; i++) {\n' +
' finalArray.push(x[i].innerText);\n' +
'} finalArray;'
So, im a little bit lost here and i need some help.
I have a json that come from the server with data that i dont know.
Based on that i found a solution to display the data on html here on SO:
https://stackoverflow.com/a/50352965/9721446
But the problem is that each "item" is an entry from array, so if i ngfor array, it outputs each line as an item, and i want the item to be all entries of each result.
heres the html:
<ng-container *ngFor="let item of singleArray | paginate: { itemsPerPage:411, currentPage: p} ">
<!-- All the entries -->
<div class="w3-container">
<!-- Table view-->
<table class="center">
<tr *ngIf="!item.tag.includes('URL') && !item.tag.includes('linkChal')">
<td><div class="col-xs-auto thick">{{item.tag.toLowerCase() | translate}}</div></td>
<td class="tab">{{item.value}}</td>
</tr>
<tr *ngIf="item.tag.includes('URL')">
<td>Link da entrada: </td>
<td> - Ver mais -</td>
</tr>
<tr *ngIf="item.tag.includes('linkChal')">
<td>Link do Challenge: </td>
<td> - Challenge -</td>
</tr>
</table>
<div style="background-color: #ff7d2a">
<ul *ngIf=" item.tag.includes('---------')"><p>New Entry</p></ul>
</div>
</div>
</ng-container>
Ts:
for(let i in res)
{
//array with entities from json
this.entity.push(i);
for(let j in res[i])
{
let val = Number(j)+1;
this.cont.push(i +" - nº: " + val );
this.singleArray.push({
tag: i,
value: val
});
for(let t in res[i][j])
{
this.test.push(t);
this.cont.push(t +" - "+ this.responseList[i][j][t]) ;
if(t.split(".",2)[1] === "CompositeId")
{
this.test.push("URL:");
//Get the id
this.cont.push(this.moduleName + "/" + t.split(".",2)[0] + "/" + this.responseList[i][j][t].match(/=(.*)_/)[1]);
//debugger;
this.singleArray.push({
tag: "URL:",
value: this.moduleName + "/" + t.split(".",2)[0] + "/" + this.responseList[i][j][t].match(/=(.*)_/)[1]
});
}
else if(t.split(".",2)[1] === "Challenge")
{
this.singleArray.push({
tag: "linkChal",
value: this.moduleName + "/" +t.split(".",2)[1] + "/" + this.responseList[i][j][t].match(/=(.*)_/)[1]
});
}
else {
this.singleArray.push({
tag: t,
value: this.responseList[i][j][t]
});
}
}
this.test.push("\n");
this.cont.push("\n");
this.singleArray.push({
tag: "---------\n",
value: "--------\n"
});
//it ends an item here
}
}
Heres the output i have with that:
Each one line is an entry from the array, the big question is, how to transform all lines/entries until "New Entry" and made an single item to ngfor and display data into a card that i already have..)
I've tried to create an array and push the singleArray into it (hoping each entry of that new array was an item that i want), at the end of for(let j in res[i]) on .ts but it just repeated all the entries creating a bunch of entries..
here, at the end of that for, i've tried to push an array with something, then ngfor it (it gives me the number items that i want, but then i dont have the results to access them..)
Has anyone had this problem before?
thanks in advance
Edit: here's what singleArray looks like:
Your best bet here is to follow the single responsibility principal and separate the concerns of each class.
Stop trying to do this all in the view and separate out the responsibility of formatting the data and the problem will seem much simpler.
Make a new class to define the model you want your view to use
Have your view implement this new ideal model that you control
Generate some test data to make get this looking like what you want
Create a new class who's entire responsibility is to turn the external model from the api response into this new internal model
json2ts may help generate a better external model from the response, but it may not be of much use in this case
Once you have done the above, based on your sample output, it should be fairly simple to convert from the external model into the internal model. It's hard to convey this, but assuming the hyphens are the item separator you could simply do something like the following:
const externalItems = // data from api
const internalItems = [];
let currentInternalItem = {};
externalItems.forEach(item => {
if (item.tag.startsWith('---------')) {
internalItems.push(currentInternalItem);
currentInternalItem = {};
} else {
currentInternalItem[item.tag] = item.value;
}
});
This would group the array back into an object that you can use in your view.
I think I'm complicating too much.. The objective here is to display what comes from JSON into specific locations, like a card, with header and content, to better display the results.
I have a service that gives me a JSON, that i never knows what inside, that depends on the search term and can bring much information. For example:
If the term is "Idea":
If the term is Challenge:
My .ts file is only console.log what comes from the api.
ngOnInit() {
var setting = {setting to connect the server..}
enter code here
$.ajax(settings).done((rest) => this.response(rest));
}
response(res){
console.log(res);
}
How can i display that data the way i want?
Sorry for the long post, and for not beeing objective on the main question.
actually i need to parse a HTML table and that table contains HTML character, you can see in image.
i need each cell data with that special character also. Right now when i am parsing the table with XPath its ignore that cell and returns that cell value as empty.
Both Image attached here.
$table_head = $summary_nodes->childNodes->item(0);
$table_body = $summary_nodes->childNodes->item(1);
$head = [];
$body = [];
// print_r($table_head);
foreach($table_head->childNodes as $h_index => $h_node){
$head_temp = [];
foreach($h_node->childNodes as $cell_index => $cell){
$head_temp[] = trim($cell->nodeValue);
}
$head[] = $head_temp;
}
foreach($table_body->childNodes as $b_index => $b_node){
$body_temp = [];
// print_r($b_node);
foreach($b_node->childNodes as $cell_index => $cell){
print_r($cell);
$body_temp[] = trim($cell->nodeValue);
}
$body[] = $body_temp;
}
return ['table_ready'=>array_merge([$head[count($head)-1]], $body), 'headers'=> $head];
Hello friends I got answer for this, actually what is happening we are adding HTML entity inside our real data that's why while passing it's conflicting with HTML content and while parsing parser remove automatically that HTML entities so we have to make sure our real data does not have any HTML entities if we are using or if we need any entity which is similar to HTML entity please try to use they are HTML entity code.
I've read through the Highcharts how-to, checked the demo galleries, searched google, read the X amount of exact similar threads here on stackoverflow yet I cannot get it to work.
I'm logging data in a csv file in the form of date,value.
Here's what the date looks like
1355417598678,22.25
1355417620144,22.25
1355417625616,22.312
1355417630851,22.375
1355417633906,22.437
1355417637134,22.437
1355417641239,22.5
1355417641775,22.562
1355417662373,22.125
1355417704368,21.625
And this is how far I've managed to get the code:
http://jsfiddle.net/whz7P/
This renders a chart, but with no series or data at all. I think I'm fudging things up while formatting the data so it can be interpreted in highcharts.
Anyone able to give a helping hand?
So, you have the following data structure, right ?
1355417598678,22.25
1355417620144,22.25
1355417625616,22.312
1355417630851,22.375
1355417633906,22.437
1355417637134,22.437
1355417641239,22.5
1355417641775,22.562
1355417662373,22.125
1355417704368,21.625
Then you split it into an array of lines, so each array item is a line.
Then for each line you do the following.
var items = line.split(';'); // wrong, use ','
But there ins't ; into the line, you should split using ,.
The result will be a multidimencional array which each item is an array with the following structure. It will be stored in a var named data.
"1355417598678","22.25" // date in utc, value
This is the expected data for each serie, so you can pass it directly to your serie.
var serie = {
data: data,
name: 'serie1' // chose a name
}
The result will be a working chart.
So everything can be resumed to the following.
var lines = data.split('\n');
lines = lines.map(function(line) {
var data = line.split(',');
data[1] = parseFloat(data[1]);
return data;
});
var series = {
data: lines,
name: 'serie1'
};
options.series.push(series);
Looking at your line.split part:
$.get('data.csv', function(data) {
// Split the lines
var lines = data.split('\n');
$.each(lines, function(lineNo, line) {
var items = line.split(';');
It looks like you are trying to split on a semi-colon (;) instead of a comma (,) which is what is in your sample CSV data.
You need to put
$(document).ready(function() {
in the 1st line, and
});
in the last line of the javascript to make this work.
Could you upload your csv file? Is it identical to what you wrote in your original post? I ran into the same problem, and it turns out there are errors in the data file.