How to connect fire base ng2-smart-table's create data - ng2-smart-table

I have been using the ng2-smart-table template. I could not able to found the location where the data save after click the add new button.some one can help me now.
In this table create data and show in the list the data what we are created. but the case is if we are refresh the browser , the above mentioned data not saved. then what should i do for add those data for firestore.

The DataSource of the mentioned module is simply an array or LocalDataSource object according to Documentation.
Let's take an example.
On typescript file define an array like this.
data = [
{
id: 1,
name: "Leanne Graham",
username: "Bret",
email: "Sincere#april.biz"
},
{
id: 2,
name: "Ervin Howell",
username: "Antonette",
email: "Shanna#melissa.tv"
},
// ... list of items
{
id: 11,
name: "Nicholas DuBuque",
username: "Nicholas.Stanton",
email: "Rey.Padberg#rosamond.biz"
}
];
settings = {
columns: {
id: {
title: 'ID'
},
name: {
title: 'Full Name'
},
username: {
title: 'User Name'
},
email: {
title: 'Email'
}
},
add:{
confirmCreate:true
},
mode:'inline'
};
On template(html).
<ng2-smart-table (createConfirm)="addData($event)" [settings]="settings"
[source]="data"></ng2-smart-table>
Again on template.
addData(event){
//event.data is the newely created data
// Handle newly created data
// Shape of object is {
// id,
// name,
// username,
// email,
// }
// You must call event.confirm.resolve() to show data on table
}
Above addData(event) function is called when click ctrate confim.

Related

Create FormArray from api Data

I have data from an API, like this:
{ actions: 1, created_at: "2020-11-27 18:13:50", id: 18, payment: "0.00", change: "A" }
And I need to send back the data modified by user, I am using Reactive Forms for this, I am showing the data with Angular Material tables.
I have an idea that it would be more or less like this:
this.form = fB.group({data: this.fB.array( [fB.group({here.the.group}} )
How can I create the formArray from the data I receive dynamically? The idea is to be able to edit from the table and send the new formArray as the new data
You can use setValue or patchValue, I like patchValue as it comes with fewer challenges in setting up
Lets say your data is like below
{
actions: 1,
created_at: "2020-11-27 18:13:50",
id: 18,
payment: "0.00",
change: "A",
data: [
{ id: 1, name: 'item 2'},
{ id: 2, name: 'item 3'},
{ id: 3, name: 'Item 3'}
]
}
You can implement below approach to set your form
this.form = fB.group({
actions: [''],
payment: [''],
change: [''],
data: this.fb.array([])
})
get formDataArray() {
return this.form.get('data') as FormArray
}
ngOnInit() {
this.myService.getData().subscribe(({actions, payment, change, data })=> {
this.form.patchValue({ actions, payment, change });
data.forEach(({id, name})=> {
this.formDataArray.push(
this.fb.group({id: [id], name: [name] })
)
})
})
}

GraphQL Schema for Nested JSON?

I am trying to use GraphQL to deal with some JSON data. I can retrieve fields from the top level no problem. I can associate separate JSON objects also no problem. My problems are occurring trying to get at data one level down. So, I have defined a type in my schema for staff. The json looks like this:
"staff": [
{
"id": 123,
"name": "fred",
"role" : "designer",
"address": {
"street": "main street",
"town": "Springfield"
}
},
...
]
and the corresponding type in the schema looks like this so far:
const StaffType = new GraphQLObjectType({
name: 'Staff',
fields: {
id: {type: GraphQLInt},
name: {type: GraphQLString},
role: {type: GraphQLString}
}
})
This works fine as far as retrieving the id, name and role goes. My question is how can I extend StaffType to also retrieve street and town from the address field in the original JSON?
Thanks
Ok, I figured it out. I was getting hung up on the idea of a distinct Type in the schema having to refer to a separate piece of JSON whereas, in fact, I can define an AddressType in the schema to refer to the nested data and then include it in the StaffType without having to write a resolve function.
[edit to add example]
const StaffType = new GraphQLObjectType({
name: 'Staff',
fields: {
id: {type: GraphQLInt},
name: {type: GraphQLString},
role: {type: GraphQLString},
address: {type: AddressType}
}
})
const AddressType = new GraphQLObjectType({
name: 'Address',
fields: {
street: {type: GraphQLString},
town: {type: GraphQLString}
}
})

Problems with Directory API: Custom User Schema

I'm programming a function in order to update users' info. I did it and it works fine however it doesn't work when I want to use custom schemas. I checked the reference but it showed an error "Invalid Input: [employmentData] "
function directoryUpdate(userId, userDept, userLocation, userPhone,userTitle) {
var userId = 'devtest#pruebatest.com',userDept='D003', userLocation='L003';
var userTitle='T003';
var update = {
ims:
[{
type: "work",
protocol: "gtalk",
im: "liz_im#talk.example.com",
primary: true
}],
emails: [
{
address: "liz#example.com",
type: "home",
customType: "",
primary: true
}
],
addresses:
[{
type: "home",
customType: "",
streetAddress: "1600 Amphitheatre Parkway",
locality: "Mountain View",
region: "CA",
postalCode: "94043"
}
],
organizations:
[{
name: "Next Step",
title: userTitle,
primary: true,
type: "work",
department: userDept,
location: userLocation
}],
customSchemas: {
employmentData: {
employeeNumber: "123456789",
jobFamily: "Engineering",
location: "Atlanta",
jobLevel: 8,
projects: [
{ value: "GeneGnome", customType: "development" },
{ value: "Panopticon", customType: "support" }
]
}
}
};
update = AdminDirectory.Users.patch(update, userId);
Logger.log('User %s updated with result %s.', userId, update)
return true;
}
What's the error?
Greetings, Thanks in advance.
The employmentData field is inside the "customSchemas" field. Custom schemas have to be defined before using them.
To create a Custom Schema you have to use the resource Schemas.insert.
After creating the schema with the correspondent fields and type of value (STRING, INT, ETC) your code should run without issues. I tried it and worked for me.
Also, after updating the user, when making the call to Users.get, you have to set the parameter "projection=full" in order to see these values in the response.

NodeJS parsing json objects from twitter

I am looking to grab some information from the data twitter provides. Im looking to extract all the screen names that come out of this object.
T.get('followers/list', { screen_name: 'screenname' }, function (err, data, response) {
console.log(data);
});
You will receive this in the object :
{ users:
[ { id: 1234,
id_str: '1234',
name: 'Name',
screen_name: 'screenName123',
location: '....',
profile_location: null,
description: '....',
url: '...',
entities: [Object],
protected: false,
followers_count: 1751,
friends_count: 2001,
.
.
.
.
. } ] }
How can I abstract just screen_name out of this object. data.users.screen_name returns undefined.
As you can see from the console output, data.users is an array. So if you want the screen_name of the first element then just use: data.users[0].screen_name

EXTJS 4 Json nested data in grid panel

This topic has been discussed several times on the web but all subjects none helped me solve my problem.
My javascript code receives the JSON nested data. All JSON data Level 1 data are transcribed in the grid panel but all child data none.
I have tried so many ways but impossible.
That's why I'm asking you to help me please.
My JSON:
{
"success":true,
"error":false,
"redirectUrl":null,
"fund":[{
"cat_id":1,
"catname":"Europe OE Japan Large-Cap Equity",
"region":{
"region_id":2,
"region_name":"JAPAN"
}
},{
"cat_id":2,
"catname":"Europe OE Europe Large-Cap Growth Equity",
"region":{
"region_id":1,
"region_name":"EUROPE"
}
}]
}
MY model:
var Recommended = new function() {
this.DataModel = function() {
Ext.define('Fund', {
extend: 'Ext.data.Model',
fields: [{
name: 'catname',
type: 'string'
},{
name: 'cat_id',
type: 'int'
}],
proxy :{
type: 'rest',
url: application +'directory/function',
reader: {
type: 'json',
root: 'fund'
}
},
associations: [{
type: 'hasOne',
model: 'Region',
primaryKey: 'region_id',
name:'region'
}]
});
Ext.define('Region', {
extend: 'Ext.data.Model',
fields: [{
name: 'region_name',
type: 'string'
},{
name: 'region_id',
type: 'int'
}]
});
}
My Store & grid Panel:
this.JSONstore = function() {
var storeRecommended;
storeRecommended = Ext.create('Ext.data.Store', {
model: 'Fund',
autoLoad:true,
groupField: 'region_name'
});
var colModel =
[
{
text: 'REGION',
width: 200,
dataIndex: 'region_name',
name:'region_name',
mapping:'region.region_name'
},{
text: 'MORNINGSTAR',
width: 300,
dataIndex: 'catname',
name:'catname'
}
];
var groupingFeature = Ext.create('Ext.grid.feature.Grouping',{
groupHeaderTpl: 'Classe: {name} ({rows.length} Item{[values.rows.length > 1 ? "s" : ""]})',
hideGroupedHeader: false
});
var grid = Ext.create('Ext.grid.Panel', {
renderTo: 'recommendedlists',
collapsible: true,
iconCls: 'icon-grid',
frame: true,
store: storeRecommended,
width: 1200,
height: 400,
title: 'Test',
resizable: true,
features: [groupingFeature],
columns: colModel,
fbar : ['->', {
text:'Clear Grouping',
iconCls: 'icon-clear-group',
handler : function(){
groupingFeature.disable();
}
}]
});
}
this.initControlsOnload = function() {
Recommended.DataModel();
Recommended.JSONstore();
}
} // close Recommended function
The problem is your store bound to the grid knows nothing about Regions. It stores Funds. So you can't ask for a column to map to a data property that's not in the store.
The store is flat list of Fund records. And sure an individual Fund itself might know about the Region it belongs to, but the store containing a list of funds does not.
What to do?
What needs to happen is flattening out of your data structure on the client side. Why? Because the grid is flat. If you had multiple regions per fund - then we would be talking about a different solution.
How to do that?
If you control the server side of this app then add a Region field to the Fund object, then your data set is simple, straight forward and more importantly flat. If you can't (or don't want to) change the server side, then you can change the client side Model mapping. Essentially you would change your Fund model to something like this:
Ext.define('Fund', {
extend: 'Ext.data.Model',
fields: [
{ name: 'catname', type: 'string' },
{ name: 'cat_id', type: 'int' },
{ name: 'region_name', type: 'string',
mapping: 'region.region_name'},
{ name: 'region_id', type: 'int',
mapping: 'region.region_id'}
]
....
});
You see what we did there? We flattened the Region data into the Fund record. And now your store will have no problems accessing Region name data by name.
Good Luck,
Dmitry.