I have to split currency symbol ( coming from angular currency pipe ) and value into two different span, so...
I have written custom angular pipe, i have to transform value of another pipe into new value containing HTML div/span element? I used assigning output to innerHTML, but i still get data with additional message " SafeValue must use [property]=binding: ". Is this issue with implementing PIPE for generating html tags output string.
I have existing component that uses currency pipe, i have to split currency symbol and value into two different span, so that i achieve the design requirements, and this is conditional for certain case and i rely on @Input() variable
I have to rely on the result of angular currency pipe available at view html file, to add some spice to problem, the currency pipe is again coming from translate pipe for language change.
i had worked on approach using slice pipe to separate currency symbol with 0 value and amount value in another slice, but the problem is for certain language, like french the euro symbol appears at right side, while for english it appears at left, this situation is affecting my splitting process of just currency symbol, and value

|
show 2 more comments
I have written custom angular pipe, i have to transform value of another pipe into new value containing HTML div/span element? I used assigning output to innerHTML, but i still get data with additional message " SafeValue must use [property]=binding: ". Is this issue with implementing PIPE for generating html tags output string.
I have existing component that uses currency pipe, i have to split currency symbol and value into two different span, so that i achieve the design requirements, and this is conditional for certain case and i rely on @Input() variable
I have to rely on the result of angular currency pipe available at view html file, to add some spice to problem, the currency pipe is again coming from translate pipe for language change.
i had worked on approach using slice pipe to separate currency symbol with 0 value and amount value in another slice, but the problem is for certain language, like french the euro symbol appears at right side, while for english it appears at left, this situation is affecting my splitting process of just currency symbol, and value

Pipes transform data into data. To visualize data with HTML formatting, you use a component, not a pipe.
– JB Nizet
Jan 2 at 15:57
Hi @JB Nizwet thanks for response, i have existing component that uses currency pipe, i have to split currency symbol and value into two different span, so that i achieve the design requirements. I cannot do it at component level, as it is used across application.
– art-fan-vikram
Jan 2 at 16:02
1
Why couldn't you do it at component level? A component is a reusable piece of code that allows visualizing data. So create a SplitCurrencyComponent, and use it in all the templates that need to display a currency that way, passing the value to display as input.
– JB Nizet
Jan 2 at 16:05
Hey @JBNizet thanks for suggestion, I have to rely on the result of angular currency pipe available at view html file, I will check if i can get that data within component.
– art-fan-vikram
Jan 2 at 16:07
1
But that is irrelevant to your question. If you don't know how to split/display a currency using a component, using a pipe instead won't magically give you the solution. If you want help on how to display something in a certain way, then ask about that, explain your requirements clearly, and post the code you tried.
– JB Nizet
Jan 2 at 16:18
|
show 2 more comments
I have written custom angular pipe, i have to transform value of another pipe into new value containing HTML div/span element? I used assigning output to innerHTML, but i still get data with additional message " SafeValue must use [property]=binding: ". Is this issue with implementing PIPE for generating html tags output string.
I have existing component that uses currency pipe, i have to split currency symbol and value into two different span, so that i achieve the design requirements, and this is conditional for certain case and i rely on @Input() variable
I have to rely on the result of angular currency pipe available at view html file, to add some spice to problem, the currency pipe is again coming from translate pipe for language change.
i had worked on approach using slice pipe to separate currency symbol with 0 value and amount value in another slice, but the problem is for certain language, like french the euro symbol appears at right side, while for english it appears at left, this situation is affecting my splitting process of just currency symbol, and value

I have written custom angular pipe, i have to transform value of another pipe into new value containing HTML div/span element? I used assigning output to innerHTML, but i still get data with additional message " SafeValue must use [property]=binding: ". Is this issue with implementing PIPE for generating html tags output string.
I have existing component that uses currency pipe, i have to split currency symbol and value into two different span, so that i achieve the design requirements, and this is conditional for certain case and i rely on @Input() variable
I have to rely on the result of angular currency pipe available at view html file, to add some spice to problem, the currency pipe is again coming from translate pipe for language change.
i had worked on approach using slice pipe to separate currency symbol with 0 value and amount value in another slice, but the problem is for certain language, like french the euro symbol appears at right side, while for english it appears at left, this situation is affecting my splitting process of just currency symbol, and value


edited Jan 2 at 16:22
art-fan-vikram
asked Jan 2 at 15:54


art-fan-vikramart-fan-vikram
175112
175112
Pipes transform data into data. To visualize data with HTML formatting, you use a component, not a pipe.
– JB Nizet
Jan 2 at 15:57
Hi @JB Nizwet thanks for response, i have existing component that uses currency pipe, i have to split currency symbol and value into two different span, so that i achieve the design requirements. I cannot do it at component level, as it is used across application.
– art-fan-vikram
Jan 2 at 16:02
1
Why couldn't you do it at component level? A component is a reusable piece of code that allows visualizing data. So create a SplitCurrencyComponent, and use it in all the templates that need to display a currency that way, passing the value to display as input.
– JB Nizet
Jan 2 at 16:05
Hey @JBNizet thanks for suggestion, I have to rely on the result of angular currency pipe available at view html file, I will check if i can get that data within component.
– art-fan-vikram
Jan 2 at 16:07
1
But that is irrelevant to your question. If you don't know how to split/display a currency using a component, using a pipe instead won't magically give you the solution. If you want help on how to display something in a certain way, then ask about that, explain your requirements clearly, and post the code you tried.
– JB Nizet
Jan 2 at 16:18
|
show 2 more comments
Pipes transform data into data. To visualize data with HTML formatting, you use a component, not a pipe.
– JB Nizet
Jan 2 at 15:57
Hi @JB Nizwet thanks for response, i have existing component that uses currency pipe, i have to split currency symbol and value into two different span, so that i achieve the design requirements. I cannot do it at component level, as it is used across application.
– art-fan-vikram
Jan 2 at 16:02
1
Why couldn't you do it at component level? A component is a reusable piece of code that allows visualizing data. So create a SplitCurrencyComponent, and use it in all the templates that need to display a currency that way, passing the value to display as input.
– JB Nizet
Jan 2 at 16:05
Hey @JBNizet thanks for suggestion, I have to rely on the result of angular currency pipe available at view html file, I will check if i can get that data within component.
– art-fan-vikram
Jan 2 at 16:07
1
But that is irrelevant to your question. If you don't know how to split/display a currency using a component, using a pipe instead won't magically give you the solution. If you want help on how to display something in a certain way, then ask about that, explain your requirements clearly, and post the code you tried.
– JB Nizet
Jan 2 at 16:18
Pipes transform data into data. To visualize data with HTML formatting, you use a component, not a pipe.
– JB Nizet
Jan 2 at 15:57
Pipes transform data into data. To visualize data with HTML formatting, you use a component, not a pipe.
– JB Nizet
Jan 2 at 15:57
Hi @JB Nizwet thanks for response, i have existing component that uses currency pipe, i have to split currency symbol and value into two different span, so that i achieve the design requirements. I cannot do it at component level, as it is used across application.
– art-fan-vikram
Jan 2 at 16:02
Hi @JB Nizwet thanks for response, i have existing component that uses currency pipe, i have to split currency symbol and value into two different span, so that i achieve the design requirements. I cannot do it at component level, as it is used across application.
– art-fan-vikram
Jan 2 at 16:02
1
1
Why couldn't you do it at component level? A component is a reusable piece of code that allows visualizing data. So create a SplitCurrencyComponent, and use it in all the templates that need to display a currency that way, passing the value to display as input.
– JB Nizet
Jan 2 at 16:05
Why couldn't you do it at component level? A component is a reusable piece of code that allows visualizing data. So create a SplitCurrencyComponent, and use it in all the templates that need to display a currency that way, passing the value to display as input.
– JB Nizet
Jan 2 at 16:05
Hey @JBNizet thanks for suggestion, I have to rely on the result of angular currency pipe available at view html file, I will check if i can get that data within component.
– art-fan-vikram
Jan 2 at 16:07
Hey @JBNizet thanks for suggestion, I have to rely on the result of angular currency pipe available at view html file, I will check if i can get that data within component.
– art-fan-vikram
Jan 2 at 16:07
1
1
But that is irrelevant to your question. If you don't know how to split/display a currency using a component, using a pipe instead won't magically give you the solution. If you want help on how to display something in a certain way, then ask about that, explain your requirements clearly, and post the code you tried.
– JB Nizet
Jan 2 at 16:18
But that is irrelevant to your question. If you don't know how to split/display a currency using a component, using a pipe instead won't magically give you the solution. If you want help on how to display something in a certain way, then ask about that, explain your requirements clearly, and post the code you tried.
– JB Nizet
Jan 2 at 16:18
|
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
});
}
});
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%2f54009315%2fi-have-to-split-currency-symbol-coming-from-angular-currency-pipe-and-value%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
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.
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%2f54009315%2fi-have-to-split-currency-symbol-coming-from-angular-currency-pipe-and-value%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
Pipes transform data into data. To visualize data with HTML formatting, you use a component, not a pipe.
– JB Nizet
Jan 2 at 15:57
Hi @JB Nizwet thanks for response, i have existing component that uses currency pipe, i have to split currency symbol and value into two different span, so that i achieve the design requirements. I cannot do it at component level, as it is used across application.
– art-fan-vikram
Jan 2 at 16:02
1
Why couldn't you do it at component level? A component is a reusable piece of code that allows visualizing data. So create a SplitCurrencyComponent, and use it in all the templates that need to display a currency that way, passing the value to display as input.
– JB Nizet
Jan 2 at 16:05
Hey @JBNizet thanks for suggestion, I have to rely on the result of angular currency pipe available at view html file, I will check if i can get that data within component.
– art-fan-vikram
Jan 2 at 16:07
1
But that is irrelevant to your question. If you don't know how to split/display a currency using a component, using a pipe instead won't magically give you the solution. If you want help on how to display something in a certain way, then ask about that, explain your requirements clearly, and post the code you tried.
– JB Nizet
Jan 2 at 16:18