Sorry if this is really simple...
$('#product-details dd').each((i, el) => {
const title = $(el).text()
console.log(title);
the page im scraping has 12 <dd> tags but i only want the first 7
You can use slice:
$('#product-details dd').get().slice(0,7),map(dd => $(dd).text())
Related
If I have JSX like
<div>Hello there are 123 oranges</div>
Here's how text is set.
const Component = ({text}) => {
return(
<div>{text}</div>
)
}
I wanna make 123 red color. However, the text inside div is dynamic, so I can't insert span by hardcoding. Hopefully CSS can detect numeric but I couldn't find one by googling.
Are there any good and concise solutions?
It 's possible with dangerouslySetInnerHTML, you need regex to match the numeric part from your dynamic string and then generate the updated string with a style wrapped around that numeric part.
const yourText = yourText.replace(/\d+/, m => `<span style="color: red">${m}</span>` );
then pass this to dangerouslySetInnerHTML.
<div dangerouslySetInnerHTML={{__html: yourText}}></div>
You can perhaps try with regex
text.replaceAll(/(\d+)/g,'<span className="num">$1</span>')
String.prototype.replaceAll is an ES10 method.
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>
I need to get all the links in the table on this page : https://www.sahibinden.com/en/cars/used
I am using this library: https://www.npmjs.com/package/xpath-html
The issue is that when I print results it only gives me the first link.
let results = xpathT.fromPageSource(data).findElement("//tbody[#class='searchResultsRowClass']//a");
console.log("HERE NOSEDSS");
console.log(results);
console.log("The href value is:", results[1].getAttribute("href"));
How do I get all the links?
According to the doc you have to use findElements with a s. If I modify a bit your XPath, you can have something like this :
const nodes = xpath.fromPageSource(html).findElements("//a[#class='classifiedTitle']");
console.log("Number of ads found:", nodes.length);
console.log("Link[0]:", nodes[0].getAttribute("href"));
console.log("Link[1]:", nodes[1].getAttribute("href"));
...
Of course it's better if you write a loop to print all the links. Something like :
for (let x = 0; x < nodes.length; x++) {
console.log(nodes[x].getAttribute("href"));
}
I have an issue rendering parameters in Angular 8, I get datas from API that I need to render in divs that matchs those datas but I'm having an issue where the datas shows in every divs, here's what it looks like :
Here, "Drops","Misc","Network" are the main divs that need to render the lower-categories.
Altought, what I want is for example, to have only "Drops Aluminium" inside the main "Drops", only "VANNE" inside "Misc" and "Main" in "Network". The lower categories should only renders when they have their ids inside the main id ( see picture 2 below ).
What I have tried :
Binding the values inside the divs, since all main and lower categories have ids like so :
Here is a stackblitz example : https://stackblitz.com/edit/angular-me2ppb?file=src%2Fapp%2Fapp.component.ts
Thank you in advance for your time and help, it's much appreciated !
If I understand correctly, could you just solve it with a nested loop in the template?
<div *ngFor="let main of total_by_level | keyvalue">
{{label_name[main.key]}}
<div *ngFor="let sub of main.value | keyvalue">
{{label_name[sub.key]}}
</div>
</div>
This would result in:
Network
Main
Drops
Drops Aluminium
Misc
VANNE
You have 2 options here:
Adapt your HTML to loop around total_by_level and query label_name appropriately
Build the output in code
It looks like you have attempted both, and so are open to either. Personally, I prefer to do as much as possible in the code and keep the HTML as dumb as possible, so I would take approach 2.
In ngOnInit() (which should be where you do any initial processing), I would build an array based on the structure on total_by_level.
output: any[];
ngOnInit() {
this.output = Object.keys(this.total_by_level).map(levelKey => {
const child = this.total_by_level[levelKey];
return {
level: {
label: this.label_name[levelKey]
},
children: Object.keys(child).map(childKey => ({
label: this.label_name[childKey],
value: child[childKey]
}))
};
});
}
It then becomes simple to bind to this array in your HTML:
<div *ngFor="let item of output">
{{item.level.label}}
<div *ngFor="let child of item.children">
{{child.label}}
{{child.value}}
</div>
</div>
You are dealing with some odd data structures, and I'm not sure of your terminology, so I have guessed a little bit here. You can take the concept of this idea and work with it. I am also assuming that there is only ever 1 nested child in total_by_level.
DEMO: https://stackblitz.com/edit/angular-upqdex
I want to list all my featured news at the top but i can't get them in the right order. This is what i got:
var featuredNewsCollection = allNewsCollection.Where(x =>
featuredNewsIds.Contains(x.Id));
This lists the featured news in the order they appear in allNewsCollection. I want them in the order they appear in featuredNewsIds int list. Is there a smart way to rearrange this?
Try like that:
var featuredNewsCollection = allNewsCollection.Where(x => featuredNewsIds.Contains(x.Id)).OrderBy(x => featuredNewsIds.IndexOf(x.Id));