5 lines
26 KiB
JSON
Raw Permalink Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{
"id": "api/common/PercentPipe",
"title": "PercentPipe",
"contents": "\n\n<article>\n <div class=\"breadcrumb-container\">\n <div class=\"breadcrumb\">\n <script type=\"application/ld+json\">\n {\n \"@context\": \"http://schema.org\",\n \"@type\": \"BreadcrumbList\",\n \"itemListElement\": [\n { \"@type\": \"ListItem\", \"position\": 1, \"item\": { \"@id\": \"https://angular.io//api\", \"name\": \"API\" } },\n { \"@type\": \"ListItem\", \"position\": 2, \"item\": { \"@id\": \"https://angular.io/api/common\", \"name\": \"@angular/common\" } },\n { \"@type\": \"ListItem\", \"position\": 3, \"item\": { \"@id\": \"https://angular.io/api/common/PercentPipe\", \"name\": \"PercentPipe\" } }\n ]\n }\n </script>\n <a href=\"/api\">API</a> > <a href=\"api/common\">@angular/common</a>\n </div>\n <div class=\"github-links\">\n <a href=\"https://github.com/angular/angular/edit/master/packages/common/src/pipes/number_pipe.ts?message=docs(common)%3A%20describe%20your%20change...#L107-L162\" aria-label=\"Suggest Edits\" title=\"Suggest Edits\"><i class=\"material-icons\" aria-hidden=\"true\" role=\"img\">mode_edit</i></a>\n <a href=\"https://github.com/angular/angular/tree/12.0.0-next.7/packages/common/src/pipes/number_pipe.ts#L107-L162\" aria-label=\"View Source\" title=\"View Source\"><i class=\"material-icons\" aria-hidden=\"true\" role=\"img\">code</i></a>\n</div>\n </div>\n \n <header class=\"api-header\">\n <h1 id=\"percentpipe\">PercentPipe<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/common/PercentPipe#percentpipe\"><i class=\"material-icons\">link</i></a></h1>\n \n <label class=\"api-type-label pipe\">pipe</label>\n \n \n \n </header>\n \n <aio-toc class=\"embedded\"></aio-toc>\n\n <div class=\"api-body\">\n \n <section class=\"short-description\">\n <p>Transforms a number to a percentage\nstring, formatted according to locale rules that determine group sizing and\nseparator, decimal-point character, and other locale-specific\nconfigurations.</p>\n\n \n </section>\n \n \n \n<section class=\"pipe-overview\">\n <code-example hidecopy=\"true\" class=\"no-box api-heading\">{{ value_expression | <span class=\"kwd nocode\">percent</span> [ : digitsInfo [ : locale ] ] }}</code-example>\n\n <h2 id=\"ngmodule\">NgModule<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/common/PercentPipe#ngmodule\"><i class=\"material-icons\">link</i></a></h2>\n<ul class=\"ngmodule-list\">\n\n <li>\n <a href=\"api/common/CommonModule\">\n <code-example language=\"ts\" hidecopy=\"true\" class=\"no-box\">CommonModule</code-example>\n </a>\n </li>\n \n</ul>\n\n\n\n \n <h2 id=\"input-value\">Input value<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/common/PercentPipe#input-value\"><i class=\"material-icons\">link</i></a></h2>\n <table class=\"is-full-width list-table parameters-table pipe-parameters\">\n <tbody>\n \n <tr class=\"pipe-parameter\">\n <td class=\"param-name\">\n <a id=\"\"></a>\n <code>value</code>\n </td>\n <td class=\"param-type\"><code>string | <a href=\"api/common/DecimalPipe\" class=\"code-anchor\">number</a></code></td>\n <td class=\"param-description\">\n \n \n </td>\n </tr>\n </tbody>\n</table>\n \n \n <h2 id=\"parameters\">Parameters<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/common/PercentPipe#parameters\"><i class=\"material-icons\">link</i></a></h2>\n <table class=\"is-full-width list-table parameters-table pipe-parameters\">\n <tbody>\n \n <tr class=\"pipe-parameter\">\n <td class=\"param-name\">\n <a id=\"\"></a>\n <code>digitsInfo</code>\n </td>\n <td class=\"param-type\"><code>string</code></td>\n <td class=\"param-description\">\n <p>Optional. Default is <code>undefined</code>.</p>\n \n </td>\n </tr>\n <tr class=\"pipe-parameter\">\n <td class=\"param-name\">\n <a id=\"\"></a>\n <code>locale</code>\n </td>\n <td class=\"param-type\"><code>string</code></td>\n <td class=\"param-description\">\n <p>Optional. Default is <code>undefined</code>.</p>\n \n </td>\n </tr>\n </tbody>\n</table>\n \n</section>\n\n\n \n<section class=\"see-also\">\n <h2 id=\"see-also\">See also<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/common/PercentPipe#see-also\"><i class=\"material-icons\">link</i></a></h2>\n <ul>\n \n <li><p><code><a href=\"api/common/formatPercent\" class=\"code-anchor\">formatPercent</a>()</code></p>\n</li>\n </ul>\n</section>\n\n\n \n\n\n \n<section class=\"usage-notes\">\n <h2 id=\"usage-notes\">Usage notes<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/common/PercentPipe#usage-notes\"><i class=\"material-icons\">link</i></a></h2>\n <p>The following code shows how the pipe transforms numbers\ninto text strings, according to various format specifications,\nwhere the caller's default locale is <code>en-US</code>.</p>\n<code-example path=\"common/pipes/ts/percent_pipe.ts\" region=\"PercentPipe\">\n@<a href=\"api/core/Component\" class=\"code-anchor\">Component</a>({\n selector: 'percent-pipe',\n template: `&#x3C;div>\n &#x3C;!--output '26%'-->\n &#x3C;p>A: {{a | <a href=\"api/common/PercentPipe\" class=\"code-anchor\">percent</a>}}&#x3C;/p>\n\n &#x3C;!--output '0,134.950%'-->\n &#x3C;p>B: {{b | <a href=\"api/common/PercentPipe\" class=\"code-anchor\">percent</a>:'4.3-5'}}&#x3C;/p>\n\n &#x3C;!--output '0 134,950 %'-->\n &#x3C;p>B: {{b | <a href=\"api/common/PercentPipe\" class=\"code-anchor\">percent</a>:'4.3-5':'fr'}}&#x3C;/p>\n &#x3C;/div>`\n})\nexport class PercentPipeComponent {\n a: number = 0.259;\n b: number = 1.3495;\n}\n\n</code-example>\n\n</section>\n\n\n\n </div>\n</article>\n\n<!-- links to this doc:\n - api/common\n - api/common/CommonModule\n - api/core/PipeTransform\n - guide/ajs-quick-reference\n - guide/i18n\n - guide/pipes\n-->\n<!-- links from this doc:\n - /api\n - api/common\n - api/common/CommonModule\n - api/common/DecimalPipe\n - api/common/PercentPipe#input-value\n - api/common/PercentPipe#ngmodule\n - api/common/PercentPipe#parameters\n - api/common/PercentPipe#percentpipe\n - api/common/PercentPipe#see-also\n - api/common/PercentPipe#usage-notes\n - api/common/formatPercent\n - api/core/Component\n - https://github.com/angular/angular/edit/master/packages/common/src/pipes/number_pipe.ts?message=docs(common)%3A%20describe%20your%20change...#L107-L162\n - https://github.com/angular/angular/tree/12.0.0-next.7/packages/common/src/pipes/number_pipe.ts#L107-L162\n-->"
}