Как установить значение по умолчанию внутри элемента текстового поля HTML, используя директиву Angular. Пожалуйста, обратитесь ниже код - PullRequest
Новая
       19

Как установить значение по умолчанию внутри элемента текстового поля HTML, используя директиву Angular. Пожалуйста, обратитесь ниже код

1 голос
/ 14 февраля 2020

Ниже код отлично работает для изменения внутреннего HTML из "div, heading tags", но не работает для текстовых полей 

@Component({
  selector: 'app-root',
  template: ` <h3 appNamevalidation >Angular 7 Template-Driven Form Validation</h3>
  <input type = "text" [(ngModel)]="model.firstName" #firstName="ngModel" required appNamevalidation 
  />`
})

@Directive({
  selector: '[appNamevalidation]'
})

export class NamevalidationDirective {
  constructor(private elem: ElementRef) { }

  ngOnInit() {
    console.log(' inside ngOninIt directive hook');
    this.elem.nativeElement.value = "Changed by directive inside NG ONIT";
    this.elem.nativeElement.innerHTML = "Changed by directive inside NG ONIT";
  }
}

1 Ответ

1 голос
/ 14 февраля 2020

Хук ngOnInit вашей директивы выполняется перед привязкой вашего ngModel к вашему входу. Вы можете использовать другой хук жизненного цикла, например ngAfterViewChecked, чтобы он заработал: 

export class NamevalidationDirective {
    constructor(private elem: ElementRef) { }

    ngAfterViewChecked() {
        this.elem.nativeElement.value = "Changed by directive inside NG ONIT";
        this.elem.nativeElement.innerHTML = "Changed by directive inside NG ONIT";
    } 
}
...