Угловой + PrimeNG пользовательский подтвердитьDialog - PullRequest
Новая
       9

Угловой + PrimeNG пользовательский подтвердитьDialog

0 голосов
/ 28 апреля 2018

Мне нужно написать собственный @component для отображения диалогов подтверждения, которые всегда имеют три переменные конфигурации: verifyButtonLabel, messageText, acceptFunction.

Я стремлюсь перенести все эти три в один объект "конфигурации".

Вот как выглядит component.ts: 

import {Component, Input, OnInit} from '@angular/core';
import {Configuration} from '../../model/confirmModal.model';

@Component({
  selector: 'app-my-confirm-dialog',
  templateUrl: './myConfirmDialog.component.html'
})

export class myConfirmDialogComponent implements OnInit {
  ngOnInit(): void {}
  accept():void {
   this.configuration.accept();
  }

  @Input()
   configuration: Configuration;
}

Там есть объект, содержащий все конфигурации 

configurations = {  
  config1: {
    confirmButtonLabel: 'Yep',
    message: 'Do you want to confirm?',
    accept: (): void => { alert('confirmed'); }
  },
  config2: {
    confirmButtonLabel: 'Yop',
    message: 'Do you want to confirm 2?',
    accept: (): void => { alert('confirmed 2'); }
  },
 };

Вот как выглядит component.html: 

<p-confirmDialog class="my-confirm-dialog" icon="fa fa-question-circle" [message]="configuration.message" #cd>
 <p-footer>
   <p-button label="Cancel" (onClick)="cd.reject()"></p-button>
   <p-button (onClick)="accept()"></p-button>
 </p-footer>
</p-confirmDialog>

Я поместил Компонент на место, как это внутри родительского элемента. 

<app-my-confirm-dialog [configuration]="confirmations"></app-my-confirm-dialog>

И, наконец, я запускаю показ диалогового окна следующим образом: 

ngOnInit{
  this.someEntry = {
    label: 'Config1Dialog', 
    command: (event) => this.showMyConfirmDialog(this.configurations.config1);
};}
...
showMyConfirmDialog = (confirmDialog): void => {
  this.confirmLabel = confirmDialog.confirmLabel;
  this.confirmationService.confirm(confirmDialog);
}

Итак, что происходит сейчас, так это то, что Сообщение диалога всегда верно, но ни метка кнопки подтверждения, ни функция включения подтверждения не работают. Я не очень хорошо разбираюсь в угловых моментах и ​​не нашел хороших инструкций для этого случая.

...