-1

我在我的应用程序中使用来自 Syncfusion 的 Angular NumericTextbox。我们遇到的问题是，当您单击输入时，它会自动选择它。有没有办法禁用它？

问题： https ://gyazo.com/a72bd4aaf4ebda7a98256d31e3959a48

文档： https ://ej2.syncfusion.com/angular/documentation/numerictextbox/getting-started/

HTML：

<ejs-numerictextbox
  [floatLabelType]="floatLabelType"
  [enabled]="enabled"
  [min]="min"
  [max]="max"
  [placeholder]="caption"
  [format]="format"
  [ngClass]="{
    'e-success': (control?.dirty || control?.touched) && !control?.invalid,
    'e-error': (control?.dirty || control?.touched) && control?.invalid,
    'hum-show-required': !this.hideRequired,
    'hum-required': isRequired()
  }"
  [currency]="currency"
  (change)="updateControlValue($event)"
  (blur)="handleBlur($event)"

></ejs-numerictextbox>

TS

export class FormNumberComponent extends FormBaseComponent {
  @ViewChild(NumericTextBoxComponent, { static: true }) valueAccessor: ControlValueAccessor;

  @Input() format: string = 'n0';
  @Input() min = 0;
  @Input() max: number;
  @Input() currency = 'EUR';

  private busy: boolean;

  constructor(injector: Injector, stateService: StateService) {
    super(injector);

    this.initLogging(false, 'FormNumberComponent');
    this.currency = stateService.getCurrency();
  }

  updateControlValue(event: any): void {
    console.log(event);
    setTimeout(() => {
      // todo - hacky way to fix the issue (integration of ejs with form needs to be refactored)
      const formControl: NumericTextBoxComponent = this.valueAccessor as NumericTextBoxComponent;

      if (!isObjectEmpty(formControl) && !formControl.isDestroyed) {
        this.busy = true;
        formControl.focusIn();
        formControl.focusOut();
        this.busy = false;
      }
    });
  }

  handleBlur(e) {
    if (!this.busy) {
      super.handleBlur(e);
    }
  }
}
4

1 回答 1

0 
Your requirement to disable the auto select functionality of the Numeric textbox inputs can be achieved by using the click event. please check the code below,

Code snippet
<ejs-numerictextbox
        value="10"
        (click)="OnClick($event)">
</ejs-numerictextbox>

OnClick(args): void {
    var position = args.srcElement.selectionEnd;
    args.srcElement.selectionStart = args.srcElement.selectionEnd = position;
  }

Sample: https://stackblitz.com/edit/angular-vgqmzs-i93zpr?file=app.component.ts
于 2022-01-25T07:33:02.077 回答