i want to create football matches using this JSON:
export const teams: Array<any> = [
{
name: 'A',
teams: [
{
name: 'France',
},
{
name: 'Portugual',
},
{
name: 'india',
},
{
name: 'china',
}
]
},
]
so for example i want to make matches france vs india than france vs china .
so i am using Angular 8 , and i have some issues if anyone can help me in that code .
HTML:
<div class="col-3" *ngFor="let group of group1">
<h5>{{ group }}</h5>
</div>
TypeScript:
this.group1 = this.teams;
this.teams.forEach((item, index) => {
this.groupList.push(item.name);
item.teams.forEach((item, index) => {
this.group1.push(item.name);
});
});
What I believe you want to do is display a list of all possible matches within this JSON, and I assume that since the teams array is in it's own array of objects with a name tag, that there may be separate groups of matches that you wish to display.
I have created a Stackblitz project you can view here to see my implementation of what I believe it is you are looking for.
I will explain my code below.
HTML:
<div class="col-3" *ngFor="let group of groupList">
<h5>{{ group }}</h5>
</div>
I wasn't sure what the difference between 'group1' and 'groupList' were supposed to be in your code, so I have selected groupList as my display value, and use 'group1' as a property in the TS.
TS:
for (let teamGroup of this.group1) {
this.groupList.push("Group: " + teamGroup.name); // show the group
for (let team1 of teamGroup.teams) {
for (let team2 of teamGroup.teams) {
// iterate over every possibility of two teams facing each other
if (
this.groupList.indexOf(
String(team1.name + " vs. " + team2.name)
) === -1 &&
this.groupList.indexOf(
String(team2.name + " vs. " + team1.name)
) === -1
) {
// filter out matchups already pushed to the array
if (team1.name !== team2.name) {
// filter out self-matches
this.groupList.push(team1.name + " vs. " + team2.name);
}
}
}
}
}
In the Stackblitz implementation, I'm using 'teams' as a property of my component, assigned to the JSON you provided, but you can get this JSON dynamically and use this code, just make sure to assign the value to the 'group1' property.
The 'groupList' property is an empty array, which we will .push() the values we wish to display to. By looping over the 'teams' array within the first (and only) entry in your JSON, we can decide on a display format for the string (I have chosen 'Team1 vs. Team2') and compare all possible matchups between two teams within the group against entries in 'groupList'. If the matchup does not exist, we will push the matchup to 'groupList'.
The end result is this:
Results
I hope this was what you were looking for. I would have asked a clarifying question in the comments first, but I'm too new to the website to be able to.
Related
I'm having a problem iterating over my json in TypeScript. I'm having trouble with one specific json field, the tribe. For some reason I can't iterate over that one. In the debugger, I'm expecting the Orc to show up but instead I get a 0. Why is this? How do I iterate correctly over my tribe data?
// Maps a profession or tribe group name to a bucket of characters
let professionMap = new Map<string, Character[]>()
let tribeMap = new Map<string, Character[]>()
let herolistJson = require('./data/HeroList.json')
for (let hero of herolistJson){
// Certain characters can have more than one tribe
// !!!!! The trouble begins here, tribe is 0???
for (let tribe in hero.tribe){
let tribeBucket = tribeMap.get(tribe) as Character[]
// If the hero does not already exist in this tribe bucket, add it
if(tribeBucket.find(x => x.name == hero.name) === undefined )
{
tribeBucket.push(new Character(hero.name, hero.tribe, hero.profession, hero.cost))
}
}
}
My json file looks like this
[
{
"name": "Axe",
"tribe": ["Orc"],
"profession": "Warrior",
"cost": 1
},
{
"name": "Enchantress",
"tribe": ["Beast"],
"profession": "Druid",
"cost": 1
}
]
in iterates over the keys of an object, not the values. The keys of an array are its indices. If you use of instead, you'll use the newer iterator protocol and an Array's iterator provides values instead of keys.
for (let tribe of /* in */ hero.tribe) {
Note, that this won't work in IE 11, but will work in most other browsers as well many JS environments that are ES2015 compatible. kangax/compat has a partial list.
Change the "in" to "of" in second loop.
Iam working on an application where I display products in my inventory based on the user's "price range"..
I need to know how to extract the values (prices) entered in the input text.
I tried using the system entities #sys-currency & #sys-number but I can extract only one value(the first value)..
example:
the user asks to "display products between $200 and $500"
how can i extract both the values to be compared with the individual products prices and display relevant products..
suggestions appreciated..
In the node in watson conversation you can access entities as array. In your case it will be:
Currency 1: <? entities['sys-currency'] != null && entities['sys-currency'].size()> 0 ? entities['sys-currency'][0].value : "---" ?>; Currency 2: <? entities['sys-currency'] != null && entities['sys-currency'].size()> 1 ? entities['sys-currency'][1].value : "---" ?>
You need to add proper null checks and checks if array has more that one entered currency
If you're using nodejs, based on conversation-simple example from IBM Developers, you can do something like:
And the Node:
Code for access this values:
function updateMessage(input, data, req, res) {
console.log("Entties: "+JSON.stringify(data.entities));
//200 and 500 do something
if (data.entities[0].value == '200' && data.entities[1].value == '500') {
console.log("User choice value:" + data.entities)
// showProducts(data, req, res); do something inside this function
// or paste your code for do something here
}
Debugg:
Obs.: If the user types only one value (#sys-currency) you'll need to create one if with one condition, and get this value for do something within your application with my example:
data.entities //if have one value
data.entities[i] //Watson return some array if have more than 1 value
One good idea is use the context variable and join for get all values, like:
{ "context": {
"result": "<? #sys-currency ?>"
}
},
If you passing in the context all items which in stock and you want to have output like We have X,Y,Z in stock, then you can create output in Watson
<? context.results.join(', ') ?> //all values return
Important: You need to access the data return from the Watson Conversation call (conversation.message) for access all values like entities, intents and context variables, among others. Like:
conversation.message(payload, function (err, data) {
console.log(data)
if (err) {
return res.status(err.code || 500).json(err);
}
}
I've had a hard time getting two columns from a CSV file with which I am planning on building a basic bar chart. I was planning on getting 2 arrays (one for each column) within one array that I would use as such to build a bar chart. Just getting started with D3, as you can tell.
Currently loading the data in gets me an array of objects, which is then a mess to get two columns of key-value pairs. I'm not sure my thinking is correct...
I see this similar question:
d3 - load two specific columns from csv file
But how would I use selections and enter() to accomplish my goal?
You can't load just 2 columns of a bigger CSV, but you can load the whole thing and extract the columns you want.
Say your csv is like this:
col1,col2,col3,col4
aaa1,aaa2,aaa3,aaa4
bbb1,bbb2,bbb3,bbb4
ccc1,ccc2,ccc3,ccc4
And you load it with
csv('my.csv', function(err, data) {
console.log(data)
/*
output:
[
{ col1:'aaa1', col2:'aaa2', col3:'aaa3', col4:'aaa4' },
{ col1:'bbb1', col2:'bbb2', col3:'bbb3', col4:'bbb4' },
{ col1:'ccc1', col2:'ccc2', col3:'ccc3', col4:'ccc4' }
]
*/
})
If you only want col2 and col3 (and you don't want to simply leave the other columns' data in there, which shouldn't be an issue anyway), you can do this:
var cols2and3 = data.map(function(d) {
return {
col2: d.col2,
col3: d.col3
}
});
console.log(cols2and3)
/*
output:
[
{ col2:'aaa2', col3:'aaa3' },
{ col2:'bbb2', col3:'bbb3' },
{ col2:'ccc2', col3:'ccc3' }
]
*/
I.e. the above code produced a new array of objects with only two props per object.
If you want just an array of values per column — not objects with both columns' values — you can:
var col2data = data.map(function(d) { return d.col2 }
var col3data = data.map(function(d) { return d.col3 }
console.log(col2) // outputs: ['aaa2', 'bbb2', 'ccc2']
I have a database read that returns me a JSON i'm using in my *ngFor="", in the same page i have a search bar that searchs by the user name, but i also need it o search by the user's description (if it contais the word i'm typing).
Here's my code:
My searchbar:
<ion-searchbar placeholder="Search..." (ionInput)="searchUser($event)"></ion-searchbar>
My searchUser method (the same one ionic 2 docs gives you):
searchUser(ev: any) {
// Reset items back to all of the items
this.initializeItems();
// set val to the value of the searchbar
let val = ev.target.value;
// if the value is an empty string don't filter the items
if (val && val.trim() != '') {
this.items = this.items.filter((item) => {
return (item.name.toLowerCase().indexOf(val.toLowerCase()) > -1);
})
}
}
And an example of my JSON
{
"key": {
"name": name,
"description": desc,
"city": city,
"state": state,
}, ...
}
The only thing i tried so far is add an && item.description.toLowerCase().indexOf(val.toLowerCase()) > -1 to my return, but i get nothing.
How is the best way to achieve this? With a provider? A correct line of code in my return?
Thanks :)
I think you should use OR || operator instead of AND &&.
With && you will see only results which matches both name and description.
Try this,
var searchedText = item['name'] + item['surname'];
return (searchedText.toLowerCase().includes(val.toLowerCase()));
Define extra field that you want to search.
I am converting a shopping basket to an immutable structure.
Is there an easy way with immutablejs to see if an immutable object already exists within an immutable list EXCEPT for one object property 'quantity' which could be different? List example:
[{
id: 1,
name: 'fish and chips',
modifiers: [
{
id: 'mod1',
name: 'Extra chips'
}
],
quantity: 2
},{
id: 2,
name: 'burger and chips',
modifiers: [
{
id: 'mod1',
name: 'No salad'
}
],
quantity: 1
}]
Now, say I had another object to put in the list. But I want to check if this exact item with modifiers exists in the list already? I could just do list.findIndex(item => item === newItem) but because of the possible different quantity property then it wont work. Is there a way to === check apart from one property? Or any way to do this without having to loop through every property (aside from quantity) to see if they are the same?
Currently, I have an awful nested loop to go through every item and check every property to see if it is the same.
Well this should work-
list.findIndex(item => item.delete("quantity").equals(newItem.delete("quantity"))
The equals method does deep value comparison. So once you delete the quantity, you are comparing all values that matter.
PS: please ignore code formatting, I am on SO app.
PPS: the above code is not optimal, you should compare a pre-trimmed newItem inside the arrow function instead of trimming it there.