Fill Chart dynamically with variables from Component
0
i am new to Angular so i think i'm missing something.
i have 3 variables in my component, those variables are being filled after calling .subscribe method on an observable object.
like this
this.interRetard = this.technicienService.getInterRetard(id).subscribe(data => {
this.interRetard = data;
});
the interRetard variable contains a number, i can display its value in the html by doing {{interRetard}} .
the problem is that when i try to display it with console.log() it says :
Subscriber {closed: false, _parent: null, _parents: null, _subscriptions: Array(1), syncErrorValue: null, …}
and i need it to give me the exact value like it is displaying it in the html so i can assign it to the chart like this
public doughnutChartData:number = [this.interRetard , 5, 10];
Thank you.
angular typescript asked Nov 21 '18 at 18:29
kmar akroutkmar akrout
569
add a comment |
0
i am new to Angular so i think i'm missing something.
i have 3 variables in my component, those variables are being filled after calling .subscribe method on an observable object.
like this
this.interRetard = this.technicienService.getInterRetard(id).subscribe(data => {
this.interRetard = data;
});
the interRetard variable contains a number, i can display its value in the html by doing {{interRetard}} .
the problem is that when i try to display it with console.log() it says :
Subscriber {closed: false, _parent: null, _parents: null, _subscriptions: Array(1), syncErrorValue: null, …}
and i need it to give me the exact value like it is displaying it in the html so i can assign it to the chart like this
public doughnutChartData:number = [this.interRetard , 5, 10];
Thank you.
angular typescript asked Nov 21 '18 at 18:29
kmar akroutkmar akrout
569
1
You seem to be usingthis.interRetard2 times. Once to hold the subscription returned by the subscribe, and again when you assigndatato it inside the subscribe.
– R. Richards
Nov 21 '18 at 18:34
1
this.interRetardis being assigned twice in your statement. You only need to assign it inside thesubscribecallback.
– Wrokar
Nov 21 '18 at 18:34
i removed it and something weird is happepning :/ when i do console.log(interRetard) it displayes undefined then when i trigger the method again (selection changed of a select box) it shows the right value :/ :/
– kmar akrout
Nov 21 '18 at 18:41
What is the type of yourinterRetard?
– Rahul
Nov 21 '18 at 18:43
the type is any .. i have bad news also this is not working doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:46
add a comment |
0
0
0
i am new to Angular so i think i'm missing something.
i have 3 variables in my component, those variables are being filled after calling .subscribe method on an observable object.
like this
this.interRetard = this.technicienService.getInterRetard(id).subscribe(data => {
this.interRetard = data;
});
the interRetard variable contains a number, i can display its value in the html by doing {{interRetard}} .
the problem is that when i try to display it with console.log() it says :
Subscriber {closed: false, _parent: null, _parents: null, _subscriptions: Array(1), syncErrorValue: null, …}
and i need it to give me the exact value like it is displaying it in the html so i can assign it to the chart like this
public doughnutChartData:number = [this.interRetard , 5, 10];
Thank you.
angular typescript asked Nov 21 '18 at 18:29
kmar akroutkmar akrout
569
i am new to Angular so i think i'm missing something.
i have 3 variables in my component, those variables are being filled after calling .subscribe method on an observable object.
like this
this.interRetard = this.technicienService.getInterRetard(id).subscribe(data => {
this.interRetard = data;
});
the interRetard variable contains a number, i can display its value in the html by doing {{interRetard}} .
the problem is that when i try to display it with console.log() it says :
Subscriber {closed: false, _parent: null, _parents: null, _subscriptions: Array(1), syncErrorValue: null, …}
and i need it to give me the exact value like it is displaying it in the html so i can assign it to the chart like this
public doughnutChartData:number = [this.interRetard , 5, 10];
Thank you.
angular typescript angular typescript asked Nov 21 '18 at 18:29
kmar akroutkmar akrout
569
asked Nov 21 '18 at 18:29
kmar akroutkmar akrout
569
asked Nov 21 '18 at 18:29
kmar akroutkmar akrout
569
asked Nov 21 '18 at 18:29
kmar akroutkmar akrout
569
asked Nov 21 '18 at 18:29
kmar akroutkmar akrout
569
569
1
You seem to be usingthis.interRetard2 times. Once to hold the subscription returned by the subscribe, and again when you assigndatato it inside the subscribe.
– R. Richards
Nov 21 '18 at 18:34
1
this.interRetardis being assigned twice in your statement. You only need to assign it inside thesubscribecallback.
– Wrokar
Nov 21 '18 at 18:34
i removed it and something weird is happepning :/ when i do console.log(interRetard) it displayes undefined then when i trigger the method again (selection changed of a select box) it shows the right value :/ :/
– kmar akrout
Nov 21 '18 at 18:41
What is the type of yourinterRetard?
– Rahul
Nov 21 '18 at 18:43
the type is any .. i have bad news also this is not working doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:46
add a comment |
1
You seem to be usingthis.interRetard2 times. Once to hold the subscription returned by the subscribe, and again when you assigndatato it inside the subscribe.
– R. Richards
Nov 21 '18 at 18:34
1
this.interRetardis being assigned twice in your statement. You only need to assign it inside thesubscribecallback.
– Wrokar
Nov 21 '18 at 18:34
i removed it and something weird is happepning :/ when i do console.log(interRetard) it displayes undefined then when i trigger the method again (selection changed of a select box) it shows the right value :/ :/
– kmar akrout
Nov 21 '18 at 18:41
What is the type of yourinterRetard?
– Rahul
Nov 21 '18 at 18:43
the type is any .. i have bad news also this is not working doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:46
1
1
You seem to be using
this.interRetard 2 times. Once to hold the subscription returned by the subscribe, and again when you assign data to it inside the subscribe.– R. Richards
Nov 21 '18 at 18:34
You seem to be using
this.interRetard 2 times. Once to hold the subscription returned by the subscribe, and again when you assign data to it inside the subscribe.– R. Richards
Nov 21 '18 at 18:34
1
1
this.interRetard is being assigned twice in your statement. You only need to assign it inside the subscribe callback.– Wrokar
Nov 21 '18 at 18:34
this.interRetard is being assigned twice in your statement. You only need to assign it inside the subscribe callback.– Wrokar
Nov 21 '18 at 18:34
i removed it and something weird is happepning :/ when i do console.log(interRetard) it displayes undefined then when i trigger the method again (selection changed of a select box) it shows the right value :/ :/
– kmar akrout
Nov 21 '18 at 18:41
i removed it and something weird is happepning :/ when i do console.log(interRetard) it displayes undefined then when i trigger the method again (selection changed of a select box) it shows the right value :/ :/
– kmar akrout
Nov 21 '18 at 18:41
What is the type of your
interRetard ?– Rahul
Nov 21 '18 at 18:43
What is the type of your
interRetard ?– Rahul
Nov 21 '18 at 18:43
the type is any .. i have bad news also this is not working doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:46
the type is any .. i have bad news also this is not working doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:46
add a comment |
1 Answer
1
active
oldest
votes
1
This should work:
this.technicienService.getInterRetard(id).subscribe(data => {
this.interRetard = data;
console.log(this.iterRetard);
this.myFunction(this.iterRetard) or this.myFunction(data);
});
myFunction(p) {
// Your Logic //
}
answered Nov 21 '18 at 18:50
alokstaralokstar
45927
yes i know this works .. but i need the variable outside the method subscribe so i can put it in an array and assign the array to a chart like this ... public doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:52
can you please explain your last comment .. i don't seem to get what u're saying
– kmar akrout
Nov 21 '18 at 18:55
I edited the answer, let me know if that answers your question!
– alokstar
Nov 21 '18 at 18:56
@kmarakrout: that comment was partial, so removed it!
– alokstar
Nov 21 '18 at 19:08
1
no problem .. i think your answer is working .. i'm trying something if it works perfectly i'll let you know .. thanks
– kmar akrout
Nov 21 '18 at 19:23
|
show 1 more comment
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%2f53418439%2ffill-chart-dynamically-with-variables-from-component%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
1
This should work:
this.technicienService.getInterRetard(id).subscribe(data => {
this.interRetard = data;
console.log(this.iterRetard);
this.myFunction(this.iterRetard) or this.myFunction(data);
});
myFunction(p) {
// Your Logic //
}
answered Nov 21 '18 at 18:50
alokstaralokstar
45927
yes i know this works .. but i need the variable outside the method subscribe so i can put it in an array and assign the array to a chart like this ... public doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:52
can you please explain your last comment .. i don't seem to get what u're saying
– kmar akrout
Nov 21 '18 at 18:55
I edited the answer, let me know if that answers your question!
– alokstar
Nov 21 '18 at 18:56
@kmarakrout: that comment was partial, so removed it!
– alokstar
Nov 21 '18 at 19:08
1
no problem .. i think your answer is working .. i'm trying something if it works perfectly i'll let you know .. thanks
– kmar akrout
Nov 21 '18 at 19:23
|
show 1 more comment
1
This should work:
this.technicienService.getInterRetard(id).subscribe(data => {
this.interRetard = data;
console.log(this.iterRetard);
this.myFunction(this.iterRetard) or this.myFunction(data);
});
myFunction(p) {
// Your Logic //
}
answered Nov 21 '18 at 18:50
alokstaralokstar
45927
yes i know this works .. but i need the variable outside the method subscribe so i can put it in an array and assign the array to a chart like this ... public doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:52
can you please explain your last comment .. i don't seem to get what u're saying
– kmar akrout
Nov 21 '18 at 18:55
I edited the answer, let me know if that answers your question!
– alokstar
Nov 21 '18 at 18:56
@kmarakrout: that comment was partial, so removed it!
– alokstar
Nov 21 '18 at 19:08
1
no problem .. i think your answer is working .. i'm trying something if it works perfectly i'll let you know .. thanks
– kmar akrout
Nov 21 '18 at 19:23
|
show 1 more comment
1
1
1
This should work:
this.technicienService.getInterRetard(id).subscribe(data => {
this.interRetard = data;
console.log(this.iterRetard);
this.myFunction(this.iterRetard) or this.myFunction(data);
});
myFunction(p) {
// Your Logic //
}
answered Nov 21 '18 at 18:50
alokstaralokstar
45927
This should work:
this.technicienService.getInterRetard(id).subscribe(data => {
this.interRetard = data;
console.log(this.iterRetard);
this.myFunction(this.iterRetard) or this.myFunction(data);
});
myFunction(p) {
// Your Logic //
}
answered Nov 21 '18 at 18:50
alokstaralokstar
45927
edited Nov 21 '18 at 18:56
answered Nov 21 '18 at 18:50
alokstaralokstar
45927
answered Nov 21 '18 at 18:50
alokstaralokstar
45927
answered Nov 21 '18 at 18:50
alokstaralokstar
45927
45927
yes i know this works .. but i need the variable outside the method subscribe so i can put it in an array and assign the array to a chart like this ... public doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:52
can you please explain your last comment .. i don't seem to get what u're saying
– kmar akrout
Nov 21 '18 at 18:55
I edited the answer, let me know if that answers your question!
– alokstar
Nov 21 '18 at 18:56
@kmarakrout: that comment was partial, so removed it!
– alokstar
Nov 21 '18 at 19:08
1
no problem .. i think your answer is working .. i'm trying something if it works perfectly i'll let you know .. thanks
– kmar akrout
Nov 21 '18 at 19:23
|
show 1 more comment
yes i know this works .. but i need the variable outside the method subscribe so i can put it in an array and assign the array to a chart like this ... public doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:52
can you please explain your last comment .. i don't seem to get what u're saying
– kmar akrout
Nov 21 '18 at 18:55
I edited the answer, let me know if that answers your question!
– alokstar
Nov 21 '18 at 18:56
@kmarakrout: that comment was partial, so removed it!
– alokstar
Nov 21 '18 at 19:08
1
no problem .. i think your answer is working .. i'm trying something if it works perfectly i'll let you know .. thanks
– kmar akrout
Nov 21 '18 at 19:23
yes i know this works .. but i need the variable outside the method subscribe so i can put it in an array and assign the array to a chart like this ... public doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:52
yes i know this works .. but i need the variable outside the method subscribe so i can put it in an array and assign the array to a chart like this ... public doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:52
can you please explain your last comment .. i don't seem to get what u're saying
– kmar akrout
Nov 21 '18 at 18:55
can you please explain your last comment .. i don't seem to get what u're saying
– kmar akrout
Nov 21 '18 at 18:55
I edited the answer, let me know if that answers your question!
– alokstar
Nov 21 '18 at 18:56
I edited the answer, let me know if that answers your question!
– alokstar
Nov 21 '18 at 18:56
@kmarakrout: that comment was partial, so removed it!
– alokstar
Nov 21 '18 at 19:08
@kmarakrout: that comment was partial, so removed it!
– alokstar
Nov 21 '18 at 19:08
1
1
no problem .. i think your answer is working .. i'm trying something if it works perfectly i'll let you know .. thanks
– kmar akrout
Nov 21 '18 at 19:23
no problem .. i think your answer is working .. i'm trying something if it works perfectly i'll let you know .. thanks
– kmar akrout
Nov 21 '18 at 19:23
|
show 1 more comment
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%2f53418439%2ffill-chart-dynamically-with-variables-from-component%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
1
You seem to be using
this.interRetard2 times. Once to hold the subscription returned by the subscribe, and again when you assigndatato it inside the subscribe.– R. Richards
Nov 21 '18 at 18:34
1
this.interRetardis being assigned twice in your statement. You only need to assign it inside thesubscribecallback.– Wrokar
Nov 21 '18 at 18:34
i removed it and something weird is happepning :/ when i do console.log(interRetard) it displayes undefined then when i trigger the method again (selection changed of a select box) it shows the right value :/ :/
– kmar akrout
Nov 21 '18 at 18:41
What is the type of your
interRetard?– Rahul
Nov 21 '18 at 18:43
the type is any .. i have bad news also this is not working doughnutChartData:number = [this.interRetard ,this.interFinie,this.interAvance];
– kmar akrout
Nov 21 '18 at 18:46