In angular when i use observable subscribe method to get the data from the custom API it was looping/calling...
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
0
The below code is going into the infinite loop
I'm trying to populate the data into the angular material table, and the angular service is working absolutely fine.
I found this issue by looking into the console log(infinity loop).
export class RosterDataSource extends DataSource<any> {
dataFetch;
data;
constructor(private fetchDataService: FetchdataService) {
super();
console.log('data getting');
}
connect(): Observable<RosterShiftModel> {
this.dataFetch = this.fetchDataService.getRosterTable().subscribe(data =>
this.data = data
);
return this.data;
}
disconnect() {
this.dataFetch.unsubscribe();
}
}
In the below code subscribe method is removed and it is working fine, Data fetching from the server.
export class RosterDataSource extends DataSource<any> {
dataSourceRoster;
dataFetch;
constructor(private fetchDataService: FetchdataService) {
super();
}
connect(): Observable<RosterShiftModel> {
return this.fetchDataService.getRosterTable();
}
disconnect() {
}
}
Here is the service method
getRosterTable(): Observable<OptionsModel> {
return this.http.get<OptionsModel>('/get/getrosterinfo');
}
I wanted to know, what is happening behind the scenes, and how to fix it?
angular rxjs angular6 angular7 asked Nov 22 '18 at 7:28
RajathRajath
12211
|
show 2 more comments
0
The below code is going into the infinite loop
I'm trying to populate the data into the angular material table, and the angular service is working absolutely fine.
I found this issue by looking into the console log(infinity loop).
export class RosterDataSource extends DataSource<any> {
dataFetch;
data;
constructor(private fetchDataService: FetchdataService) {
super();
console.log('data getting');
}
connect(): Observable<RosterShiftModel> {
this.dataFetch = this.fetchDataService.getRosterTable().subscribe(data =>
this.data = data
);
return this.data;
}
disconnect() {
this.dataFetch.unsubscribe();
}
}
In the below code subscribe method is removed and it is working fine, Data fetching from the server.
export class RosterDataSource extends DataSource<any> {
dataSourceRoster;
dataFetch;
constructor(private fetchDataService: FetchdataService) {
super();
}
connect(): Observable<RosterShiftModel> {
return this.fetchDataService.getRosterTable();
}
disconnect() {
}
}
Here is the service method
getRosterTable(): Observable<OptionsModel> {
return this.http.get<OptionsModel>('/get/getrosterinfo');
}
I wanted to know, what is happening behind the scenes, and how to fix it?
angular rxjs angular6 angular7 asked Nov 22 '18 at 7:28
RajathRajath
12211
Apologize the service method which I was posted is the wrong one. It should be --> getRosterTable(). Rest all are the same only the api is different
– Rajath
Nov 22 '18 at 7:33
You cannot use subscribe inside service, it should be map and response should be returned to component. please update the correct code.
– Suresh Kumar Ariya
Nov 22 '18 at 7:35
@Rajath I edited your question but you can do so yourself :) Now, thatconnectmethod from your customDataSourcemust return an observable, so why do you need to subscribe there? What isthis.dataand why is it not declared?
– Jeto
Nov 22 '18 at 8:00
Yourconnectmethod is returning data, but data is defined asynchronously.
– Baruch
Nov 22 '18 at 23:20
apologize guys I'm not able to edit my question! @Jeto sorry, while modifying the code I removed this.data from the declaration section. Thank you for your warm response guys.
– Rajath
Nov 23 '18 at 11:22
|
show 2 more comments
0
0
0
The below code is going into the infinite loop
I'm trying to populate the data into the angular material table, and the angular service is working absolutely fine.
I found this issue by looking into the console log(infinity loop).
export class RosterDataSource extends DataSource<any> {
dataFetch;
data;
constructor(private fetchDataService: FetchdataService) {
super();
console.log('data getting');
}
connect(): Observable<RosterShiftModel> {
this.dataFetch = this.fetchDataService.getRosterTable().subscribe(data =>
this.data = data
);
return this.data;
}
disconnect() {
this.dataFetch.unsubscribe();
}
}
In the below code subscribe method is removed and it is working fine, Data fetching from the server.
export class RosterDataSource extends DataSource<any> {
dataSourceRoster;
dataFetch;
constructor(private fetchDataService: FetchdataService) {
super();
}
connect(): Observable<RosterShiftModel> {
return this.fetchDataService.getRosterTable();
}
disconnect() {
}
}
Here is the service method
getRosterTable(): Observable<OptionsModel> {
return this.http.get<OptionsModel>('/get/getrosterinfo');
}
I wanted to know, what is happening behind the scenes, and how to fix it?
angular rxjs angular6 angular7 asked Nov 22 '18 at 7:28
RajathRajath
12211
The below code is going into the infinite loop
I'm trying to populate the data into the angular material table, and the angular service is working absolutely fine.
I found this issue by looking into the console log(infinity loop).
export class RosterDataSource extends DataSource<any> {
dataFetch;
data;
constructor(private fetchDataService: FetchdataService) {
super();
console.log('data getting');
}
connect(): Observable<RosterShiftModel> {
this.dataFetch = this.fetchDataService.getRosterTable().subscribe(data =>
this.data = data
);
return this.data;
}
disconnect() {
this.dataFetch.unsubscribe();
}
}
In the below code subscribe method is removed and it is working fine, Data fetching from the server.
export class RosterDataSource extends DataSource<any> {
dataSourceRoster;
dataFetch;
constructor(private fetchDataService: FetchdataService) {
super();
}
connect(): Observable<RosterShiftModel> {
return this.fetchDataService.getRosterTable();
}
disconnect() {
}
}
Here is the service method
getRosterTable(): Observable<OptionsModel> {
return this.http.get<OptionsModel>('/get/getrosterinfo');
}
I wanted to know, what is happening behind the scenes, and how to fix it?
angular rxjs angular6 angular7 angular rxjs angular6 angular7 asked Nov 22 '18 at 7:28
RajathRajath
12211
asked Nov 22 '18 at 7:28
RajathRajath
12211
edited Nov 23 '18 at 11:48
Rajath
asked Nov 22 '18 at 7:28
RajathRajath
12211
asked Nov 22 '18 at 7:28
RajathRajath
12211
asked Nov 22 '18 at 7:28
RajathRajath
12211
12211
Apologize the service method which I was posted is the wrong one. It should be --> getRosterTable(). Rest all are the same only the api is different
– Rajath
Nov 22 '18 at 7:33
You cannot use subscribe inside service, it should be map and response should be returned to component. please update the correct code.
– Suresh Kumar Ariya
Nov 22 '18 at 7:35
@Rajath I edited your question but you can do so yourself :) Now, thatconnectmethod from your customDataSourcemust return an observable, so why do you need to subscribe there? What isthis.dataand why is it not declared?
– Jeto
Nov 22 '18 at 8:00
Yourconnectmethod is returning data, but data is defined asynchronously.
– Baruch
Nov 22 '18 at 23:20
apologize guys I'm not able to edit my question! @Jeto sorry, while modifying the code I removed this.data from the declaration section. Thank you for your warm response guys.
– Rajath
Nov 23 '18 at 11:22
|
show 2 more comments
Apologize the service method which I was posted is the wrong one. It should be --> getRosterTable(). Rest all are the same only the api is different
– Rajath
Nov 22 '18 at 7:33
You cannot use subscribe inside service, it should be map and response should be returned to component. please update the correct code.
– Suresh Kumar Ariya
Nov 22 '18 at 7:35
@Rajath I edited your question but you can do so yourself :) Now, thatconnectmethod from your customDataSourcemust return an observable, so why do you need to subscribe there? What isthis.dataand why is it not declared?
– Jeto
Nov 22 '18 at 8:00
Yourconnectmethod is returning data, but data is defined asynchronously.
– Baruch
Nov 22 '18 at 23:20
apologize guys I'm not able to edit my question! @Jeto sorry, while modifying the code I removed this.data from the declaration section. Thank you for your warm response guys.
– Rajath
Nov 23 '18 at 11:22
Apologize the service method which I was posted is the wrong one. It should be --> getRosterTable(). Rest all are the same only the api is different
– Rajath
Nov 22 '18 at 7:33
Apologize the service method which I was posted is the wrong one. It should be --> getRosterTable(). Rest all are the same only the api is different
– Rajath
Nov 22 '18 at 7:33
You cannot use subscribe inside service, it should be map and response should be returned to component. please update the correct code.
– Suresh Kumar Ariya
Nov 22 '18 at 7:35
You cannot use subscribe inside service, it should be map and response should be returned to component. please update the correct code.
– Suresh Kumar Ariya
Nov 22 '18 at 7:35
@Rajath I edited your question but you can do so yourself :) Now, that
connect method from your custom DataSource must return an observable, so why do you need to subscribe there? What is this.data and why is it not declared?– Jeto
Nov 22 '18 at 8:00
@Rajath I edited your question but you can do so yourself :) Now, that
connect method from your custom DataSource must return an observable, so why do you need to subscribe there? What is this.data and why is it not declared?– Jeto
Nov 22 '18 at 8:00
Your
connect method is returning data, but data is defined asynchronously.– Baruch
Nov 22 '18 at 23:20
Your
connect method is returning data, but data is defined asynchronously.– Baruch
Nov 22 '18 at 23:20
apologize guys I'm not able to edit my question! @Jeto sorry, while modifying the code I removed this.data from the declaration section. Thank you for your warm response guys.
– Rajath
Nov 23 '18 at 11:22
apologize guys I'm not able to edit my question! @Jeto sorry, while modifying the code I removed this.data from the declaration section. Thank you for your warm response guys.
– Rajath
Nov 23 '18 at 11:22
|
show 2 more comments
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53425840%2fin-angular-when-i-use-observable-subscribe-method-to-get-the-data-from-the-custo%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53425840%2fin-angular-when-i-use-observable-subscribe-method-to-get-the-data-from-the-custo%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Apologize the service method which I was posted is the wrong one. It should be --> getRosterTable(). Rest all are the same only the api is different
– Rajath
Nov 22 '18 at 7:33
You cannot use subscribe inside service, it should be map and response should be returned to component. please update the correct code.
– Suresh Kumar Ariya
Nov 22 '18 at 7:35
@Rajath I edited your question but you can do so yourself :) Now, that
connectmethod from your customDataSourcemust return an observable, so why do you need to subscribe there? What isthis.dataand why is it not declared?– Jeto
Nov 22 '18 at 8:00
Your
connectmethod is returning data, but data is defined asynchronously.– Baruch
Nov 22 '18 at 23:20
apologize guys I'm not able to edit my question! @Jeto sorry, while modifying the code I removed this.data from the declaration section. Thank you for your warm response guys.
– Rajath
Nov 23 '18 at 11:22