Aurelia Dialog и кнопки управления событиями

Question

Я установил плагин aurelia-dialog. Он работает, используя пример в GitHub readme, но в документации ничего не говорится о том, как использовать его в противном случае. У меня есть простой пример использования со страницей списков. Я хочу нажать кнопку «добавить новую», поместить модальное диалоговое окно с собственной виртуальной машиной. Модальный содержит простой выпадающий список. Мне нужно выбрать элемент в списке и вызвать вызов API для сохранения данных, но я не могу понять, как подключить мой метод сохранения с помощью кнопки сохранения в диалоговом окне.

Метод, который открывает диалоговое окно на моей странице списка (который работает просто отлично):

loadAgencyDialog(id){ 
    this.dialogService.open({ viewModel: AddAgency, model: { id: id }}).then((result) => { 
     if (!result.wasCancelled) { 
     console.log('good'); 
     console.log(result.output); 
     } else { 
     console.log('bad'); 
     } 
    }); 

Моего модальная Надстройка agency.js (VM для модального, а также загружает список выбора просто отлично, и да , У меня есть переменная с именем kase, потому что регистр зарезервирован):

import {DialogController} from 'aurelia-dialog'; 
import {ApiClient} from 'lib/api-client'; 
import {inject} from 'aurelia-framework'; 

@inject(DialogController, apiClient) 
export class AddAgency { 
    kase = { id: '' }; 
    constructor(controller, apiClient){ 
    this.controller = controller; 
    this.agencies = []; 
    this.apiClient = apiClient; 
    } 

    activate(kase){ 
    this.kase = kase; 
    this.apiClient.get('agencies') 
     .then(response => response.json()) 
     .then(agencies => this.agencies = agencies.data) 
     .then(() => console.log(this.agencies)); //these load fine 
    } 

    addAgency() { 
     //Do API call to save the agency here, but how? 
    } 
} 

Это часть, о которой я не знаю. В этом примере они используют controller.ok (theobjectpassedin), который возвращает обещание. Но я не понимаю, где я могу назвать метод addAgency. Есть идеи?

Answer 1

Возможно я недоразумение ваш вопрос, но вы должны быть в состоянии просто позвонить addAgency() в вашем HTML:

<button click.trigger="addAgency()">Add</button>

А потом делать то, что вам нужно сделать в addAgency(), заканчивая звоните в this.controller.ok(), чтобы обернуть модальный.

В качестве примера, вот мой модальное-х dialog-footer:

<ai-dialog-footer> 
    <button click.trigger="controller.cancel()">Cancel</button> 
    <button click.trigger="ok(item)">Save</button> 
</ai-dialog-footer> 

И в моем коде:

ok(item) { 
    this.controller.ok(item); 
} 

Не слишком сложным. Надеюсь, это поможет.