Pass custom object in routerLink - angular6

I want to pass 2 parameters to [routerLink] a string and an object
<a [routerLink]="[questionDetailRouterLink, {'question-id':question['question-id'],'question-list':this.questions}]">Show more</a>
where
questionDetailRouterLink is url/string, question['question-id'] maps to a string and this.questions is a object of class. So this.questions gets passed as its toString() equivalent i.e. [Object object]
On the receiving component side, I am trying to extract the values like this
this.question_id = this.route.snapshot.paramMap.get('question-id'); // question-details;question-id=:id'
this.questions = this.route.snapshot.paramMap.get('question-list'); //this gives [Object object]
I thought I could pass JSON.stringify version of the object (and do JSON.parse in receiving end) but I can't do this in the template [routerLink]="[questionDetailRouterLink, {'question-id':question['question-id'],'question-list':JSON.parse(this.questions)}]" - compilation error
How can I pass the object to another object (there are independent and are not parent/child) so I can't use input parameter as well

I read of two options to solve my problem. The first one is using a provider. Component A updates the values in provider P before routing to component B. Provider P has a variable to hold the object to be passed which A updates and then B reads. other option is to create a parent/child relationship between A & B and use dynamic element creation to show B when needed (ngContainer, ngTemplate, createEmbeddedView etc.)

Related

How to take some data from an object?

I have to put data from json file to my reducer.
And after mapping this file I got an object which includes data that I need.
export const datas = data.properties.map(data => (<store key={Math.floor(Math.random()*1234)} author={data.value} comment={data.group} rate={data.type} />));
this is console log, I just need props from this
How to get just normall react-table, not an object which is not accepting by reducer state?
Or how to implement it to reducer state to get effect that I need?
I am sorry for stupid questions, I hope you will help me :)
The code which you posted takes an array of objects from a variable data.properties and maps them to an array of JSX elements created by the component store. Perhaps it is better readable with line breaks.
export const datas = data.properties.map(
data => (
<store
key={Math.floor(Math.random() * 1234)}
author={data.value}
comment={data.group}
rate={data.type}
/>
)
);
Your console.log of datas shows that array of React JSX element instances. In your array you have 5 objects which are each a JSX element ($$typeof: Symbol(react.element)) with type: "store" (the component type), the numeric key that you created for this element, and a props object which contains all of the props that you passed: author, comment, and rate (key is a special prop so it is not included here).
You are asking to just create an object with the props rather than creating a store element. We want to take the array data.properties and use the .map() method to map it to this props object.
The variable name that you use inside of your .map() callback can be anything, but as a best practice I recommend that you should not use the variable name data again. Reusing a name is called variable shadowing and it won't cause errors, but it can make your code very confusing. I will call it datum instead.
Here is the code that you want:
export const propsArray = data.properties.map(
datum => ({
key: Math.floor(Math.random() * 1234),
author: datum.value,
comment: datum.group,
rate: datum.type,
})
);

Why doesn't the json model's odata property have columns?

I am creating a JSON model in UI5 from a json object. But it is missing the columns array in the JSON model. I checked the model in the console and the odata property had no columns. Check image for proof.
https://ibb.co/hLmYpZb
Hence I want to know how I can get the column to show up.
Here is my code.
var emptyModel = {
"columns": []
};
this.setModel(new JSONModel(JSON.stringify(emptyModel)), "selcontent");
I expect column to show up in the JSON model under the odata property.
JSONModel awaits a plain object or a URL string as the first argument.
Either the URL where to load the JSON from or a JS object (source)
The result of the stringified emptyModel is "{"columns":[]}" which is neither an object nor a URL.

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]

I can't read the _id property of a JSON object stored in MongoDB (MongoLab service)

I have a document on a mongodb on Heroku. Each object in the document has a system generated object id in the form of
"_id": {
"$oid": "xxxxxxxxxxxxxxxxxxxxxxxx"
}
When I make a query and get the response from the server, I stringify the response using JSON.stringify and I log the object on the server console. When I do this the following gets logged:
this is the response: [{"creator":"al","what[place]":"home","what[time [start]":"22:00","what[time][end]":"","what[details]":"","who[]":["joe","kay","mau"],"_id":"xxxxxxxxxxxxxxxxxxxxxxxx"}]
Right after the full object gets logged, I try to log the id to make sure I can access it... I want to then pass the id to a different object so that I can have a reference to the logged object.
I have this right now:
var stringyfied = JSON.stringify(res);
console.log("this is the response: " + stringyfied);
console.log("id: " + stringyfied._id);
but when the item is logged I get
id: undefined
instead of
id: "xxxxxxxxxxxxxxxxxxxxxxxx"
No matter how I try to access the _id property, I keep getting undefined even though it get printed with the console.log for the full object
I've tried:
stringyfied.id
stringyfied["_id"]
stringyfied["id"]
stringyfied._id.$oid
stringyfied.$oid
you need to use JSON.parse(), cause JSON.stringify() is to convert to string, parse is to get the object. stringifiedid is a string
What is being returned is an array with one object in it.
The way to access the _id is with stringyfied[0]._id. However, it would be cleaner to pull the object out of the array instead.
There are a few ways you can do that. If this query will only ever return one result and that's all you'll want, you can use the findOne method instead. If the query may return more than a single document, then you will want to loop through the returned results.
I also agree with #dariogriffo that you'll need to use JSON.parse() on the stringified JSON variable.

Resteasy GET - JSON in QueryString

I would like to pass JSON arrays and list of JSON objects to Reasteasy GET method in query string. How can I access them in the service method?
For example on array, if the parameter name is "employeeId", I would like to pass
?employeeId=[1,2,3]
instead of passing
?employeeId=1&employeeId=2&employeeId=3
For list of objects, I would like to pass something like
?parameter=[{val1, val2},{val1, val2},{val1, val2}]
How can I get these correctly in the server side method?
you can use the Path annotation and PathParam annotation to pick up the input values
#Path(/path/EmployeeIdArray)
public void someMethod(#PathParam("EmployeeIdArray")String[] employeeIdArray){
}
using this you can access it as
GET /path/[{val1, val2},{val1, val2},{val1, val2}]