We Keep Coding

How to pass one response other request in Angular 7 project?

Hi i am working on my Angular 7 project. I am getting one response from a api and i want to integrate that response to other api which result success in all other apis.
Here is my code :
ngOnInit() {
this.second()
}
first() {
this.service.getId(id).resp.subscribe((res => {
console.log(res);
this.firstresp = res;
});
}
second() {
this.service.getId(this.firstresp).resp.subscribe((res => {
console.log(res)
});
}
Here the problem is first function executed properly and second function i am getting response only after refreshing the page. Any solution? TIA.

This is actually an RXJS question, not an angular one. You want to use switchMap:
this.service.getId(id).resp.pipe(
switchMap((res) => {
return this.service.getId(res).resp;
})
).subscribe((rep) => {
....
});
switchMap above pipes the result of the first call into the second one then emits that result to the subscribe. No need for the firstresp etc.

Angular passing data to the back-end service using find method

I've tried checking the data and console logging it and the data exist , but when I check the request from the back-end it was not passed . Is this how we pass data to the back-end service in angular ? or I have issue with my code ? Thanks.
Code
checkExistingFeedbackRequest(formGroup: FormGroup, respondents: Identity[]): Observable<FeedbackRequest[]> {
let request = formGroup.value
const data = respondents
.map(respondent => cleanUpFeedbackRequestAssociations({
...request,
respondent,
respondentId: respondent.id
}) as FeedbackRequest);
console.log("data:" , data)
return from(this.service.find<FeedbackRequest>(data)
.pipe(
map((result) => result.data)
);
}

Multiple parameters are not being send properly in get method using Angular 5 and Node js backend

I am trying to create a API using nodejs and access it using GET method by sending parameters using Angular 5 GET method. When I am testing my API using Postman, it works fine, but sending the GET request from Angular is not giving me the result. My node js router for receiving multiple parameters code is as follow:
router.get('/:min&:max',(req,res,next)=> {
Image.find({hue: {$gt:req.params.min,$lt:req.params.max}})
.select('name url hue')
.exec()
.then(docs => {
const response={
images: docs.map(doc=> {
return {
name: doc.name,
url: doc.url,
hue: doc.hue,
_id: doc._id,
}
})
}
res.status(200).json(docs);
})
.catch(err => {
console.log(err);
res.status(500).json({
error: err
});
});
})
My angular GET method goes like this :
getSearchedImages(min, max) {
let params = {
'min': String(min),
'max': String(max)
}
this.http.get('http://localhost:3000/', { params: params})
.subscribe(val=> console.log(val))
}
Is there any problem in Angular part or is my code in Node is to be adjusted

Use POST if you want to pass parameters in request body. Otherwise, if you like GET, pass parameters in URL.
HTTP itself doesnt restrict this, but some front-end implementations do

Angular async form validation using Firebase

I'm trying to implement a form validation that checks on Firebase if a username exists. If it doesn't, then the form becomes invalid.
The form validation works fine when I mock the data using an Observable. However, it doesn't work when I fetch the data from Firebase.
This works:
fromMockData(username: string): Observable<Usernames> {
return username === 'demo' ? Observable.of({ uid: 'test' }) : Observable.of(null);
}
This one doesn't:
fromFirebase(username: string): Observable<Usernames> {
return this.afs.doc(`usernames/${username}`).valueChanges();
}
I'm accessing both services from a validation service:
fromFirebase(input: FormControl): Observable<{[key: string]: any}> {
return this.service.fromFirebase(input.value).pipe(
map(user => user ? { invalidUsername: `#${input.value} already exists` } : null),
);
}
Any ideas why it doesn't work when fetching the data from Firebase?
PS. I can see the correct value when logging user into the console - even when using Firebase. However, it's not returning the proper value to the form's errors properties (it only works in the first case: creating an Observable with mock data).
This is my form, btw:
this.form = this.fb.group({
username: ['', [], [this.validator.fromFirebase.bind(this.validator)]],
});
Demo

Because Firebase returns a streaming of data, I need to use the first operator so that only the first item is emitted:
fromFirebase(input: FormControl): Observable<{[key: string]: any}> {
return this.service.fromFirebase(input.value).pipe(
first(),
map(user => user ? { invalidUsername: `#${input.value} already exists` } : null),
);
}

MeteorJS: How to get title data via server method by given id array

What is the 'meteor'-way to get a document title by a given ID?
Collection (Articles)
{
'_id' : 'Dn59y87PGhkJXpaiZ',
'title' : 'Sample Article',
'slug' : 'sample-article'
}
client
render() {
const data = [
{ _id: 'Dn59y87PGhkJXpaiZ' },
{ _id: 'kJXpaiZDn59y87PGh' }
{ _id: 'y87PGhkJXpaiZDn59' }
]
return (
<List>
{
data.map(r => {
return <List.Item>r._id</List.Item>
})
}
)
}
With this I will get this output:
<List>
<List.Item>Dn59y87PGhkJXpaiZ</List.Item>
<List.Item>kJXpaiZDn59y87PGh</List.Item>
<List.Item>y87PGhkJXpaiZDn59</List.Item>
</List>
Now I want to display the title instead of the id. So normally I would do
data.map(r => {
const title = Articles.findOne({ _id: r._id }).title
return <List.Item>title</List.Item>
})
But the problem is, that data is a dynamic dataset and I can't/don't want to publish the complete Articles collection. Right now there is no subscription, so I don't get any results for the title.
So I think I have to do a server side call.
Meteor.call('getTitle', r._id, function(err, res) {
console.log(res)
})
But then I'll get the result in the callback function. So how do I get these into the list? Also I want to avoid multiple method calls. I think it would be better to send data and get all titles on server side and then build the list.

If you can/want to use a non async call, don't pass a callback to the Meteor.call() method:
data.map(r => {
const title = Meteor.call('getTitle',r._id);
return <List.Item>title</List.Item>
})
As stated in the docs:
If you do not pass a callback on the server, the method invocation will block until the method is complete. It will eventually return the return value of the method, or it will throw an exception if the method threw an exception.

To fetch and render the data meteor way you have to use the package called react-meteor-data to create createContainer.
For example if you were to use it then you would be able to pass it directly to the component as props.
export default createContainer((props) => {
Meteor.subscribe('questions');
return {
questions: Questions.findOne({_id: props.match.params.id})
};
}, QuestionDo);