-3

I want to add ` every 3 occurrences from the back of the string. For example, instead of 1000 in input, I want to have 1'000.

  1. Heading

    #

html but value be 1000 in angular

Peter Kim
  • 1,929
  • 14
  • 22
سعید دالوند
  • 155
  • 1
  • 6
  • 1
    Not 100% sure what you're asking, but you can create an object `inputObj = {value: 'value', text: 'text'}` and use `inputObj.text` as the display text, while using `inputObj.value` as value – Peter Kim Sep 17 '18 at 18:53
  • thank for answer but i want use any thing like mask but dont change to orginal value .. for example now if my number be 1000 show it like 1'000 without side effect on myNumber – سعید دالوند Sep 17 '18 at 18:57
  • then you can have an object where its keys are values and values are texts, such that `text = obj[value]` – Peter Kim Sep 17 '18 at 18:59
  • my code its like this but i want to show it like 1'000 and dont change value .. i have used the attribut directive to add ' after avery 3 numbers .. but unfortunently chenge the value either. – سعید دالوند Sep 17 '18 at 19:07
  • i believe on that its a disadvantages of twoWayBinding .. any way how can have a input that show anything different of value – سعید دالوند Sep 17 '18 at 19:16

2 Answers2

2
import { Pipe, PipeTransform } from '@angular/core';
import { DatePipe } from '@angular/common';

@Pipe({
    name: 'customNumbPipe',
})
export class customNumbPipe implements PipeTransform {
    transform(value: string): string {
        return value.toString().replace(/(.{3})/g,"`1")
    }
}

Then you can use the pipe like this {{ displayValue | customNumbPipe}}

I got that regex from here. It inserts an ` every 3 occurrences.

edit:

  1. changed value's type from number | string to string
  2. Just realized that it should insert an ` every 3 occurrences from the back. I think it can be done by reversing the string, inserting `'s, and reversing it back.
Peter Kim
  • 1,929
  • 14
  • 22
  • thanks.. please consider it is that . i done it but finally recived type of my model change to string type instead of number and change finally value to 1'000 that its incorrect – سعید دالوند Sep 17 '18 at 19:34
0

you could do something like this:

<input id="name" type="text" value="1000">

but the moment your users changed the value by entering something (in that input field) than your "value" would be gone replaced with what was entered. you could write javascript that listened for change in the input field and at that time assign the value you need to the data you are collecting.

Carly
  • 1
  • 2
  • first thanks .. but you misUnderstand the mattre. i want to have a value bind to ngmodel and a text to show in input html and text is some diferent of value like .. value is 1000 but text is 1'000 – سعید دالوند Sep 17 '18 at 19:42
  • in an input field the value is the value or what ever is entered because is an input filed you could have a place holder text but once again just like before it would not display once a value is entered. with a – Carly Sep 17 '18 at 20:52
  • 1
    or like is explained above use a pipe to filter what ever is inputed to a different format but that will be what is shown and not your non visible value. – Carly Sep 17 '18 at 20:55