javascript - Using a regex to replace characters in a string in an Angular template - Stack Overflow

admin管理员组

文章数量:1397024

I know that I can normally use myString.replace(/\*/g, '') to remove * from a string. But I cannot seem to make that work in a Angular HTML template. Here is what I doing ...

<div class="panel panel--raised">
  <div class="row">
    <div class="form-group col-md-6">
      <div class="form-group__text">
        <input type="text" placeholder="Search... (min of 3 characters)" [(ngModel)]="searchString" minlength="3">
      </div>
    </div>
    <div class="col-md-6">
      <button class="btn btn--success btn--small host-info-button"
              [disabled]="searchString.replace(/\*/g, '').length < 3"
              (click)="getInfo(searchString)">Search</button>
    </div>
  </div>
</div>

Parser Error: Unexpected token / ...

What am I doing wrong here?

Update:

What I am trying to do is make the user enter at least 3 characters that are not wildcard (*) characters. So a** would only count as 1 character and *** would count as zero characters, but *xyz* would count as 3 characters. I am not sure that Validator.pattern() would be able to acplish this, but maybe I am just lacking imagination.

I know that I can normally use myString.replace(/\*/g, '') to remove * from a string. But I cannot seem to make that work in a Angular HTML template. Here is what I doing ...

<div class="panel panel--raised">
  <div class="row">
    <div class="form-group col-md-6">
      <div class="form-group__text">
        <input type="text" placeholder="Search... (min of 3 characters)" [(ngModel)]="searchString" minlength="3">
      </div>
    </div>
    <div class="col-md-6">
      <button class="btn btn--success btn--small host-info-button"
              [disabled]="searchString.replace(/\*/g, '').length < 3"
              (click)="getInfo(searchString)">Search</button>
    </div>
  </div>
</div>

Parser Error: Unexpected token / ...

What am I doing wrong here?

Update:

What I am trying to do is make the user enter at least 3 characters that are not wildcard (*) characters. So a** would only count as 1 character and *** would count as zero characters, but *xyz* would count as 3 characters. I am not sure that Validator.pattern() would be able to acplish this, but maybe I am just lacking imagination.

• javascript
• angular

Share Improve this question Follow edited Apr 23, 2020 at 23:22 Red Cricket asked Apr 23, 2020 at 23:02 Red CricketRed Cricket 10.5k2323 gold badges9393 silver badges189189 bronze badges 1

• This feels like a use case for a pattern validator – bryan60 Commented Apr 23, 2020 at 23:09

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

in template:

[disabled]="isDisabled"

in ts file:

get isDisabled(): boolean {
    return this.searchString.replace(/\*/g, '').length < 3;
}

Unfortunately, RegExp literal is not supported by the templating language. They should be on your ponent.

More info on Angular Github repo issue: https://github./angular/angular/issues/21978

For this particular case, you can set up pattern validator and use something like this: Validators.pattern('/\*/g')

本文标签： javascriptUsing a regex to replace characters in a string in an Angular templateStack Overflow