Хорошо, поэтому я использую angularjs 1.5.8 и uibmodal, чтобы открыть модал с компонентом внутри модала. Я хочу, чтобы компоненты могли иметь некоторую функциональность по умолчанию, но также иметь возможность переопределять ее из контекста потребления, поэтому я пытаюсь проверить, установил ли контекст потребления эту переменную привязки 'submit'. Это прекрасно работает, когда я добавляю компонент в html и определяю функцию в контроллере-потребителе,
<contacts-form submit="vm.consumingContextSubmit(form, model)"></contacts-form>
но я не могу определить, установлена ли привязка функции 'submit', когда я открываю форму через uibmodal.
Если я поступаю неправильно, не стесняйтесь предложить лучший шаблон.
У меня есть привязки для компонента, определенного для разрешения undefined: (пробовал также с обычным старым '&'.)
angular.
module(APPNAME).
component('contactsForm', { // This name is what AngularJS uses to match to the `<contacts-form>` element.
templateUrl: '../Scripts/components/add-update-forms/contacts-form/contacts-form.component.html',
controller: 'ContactsFormController',
controllerAs: 'cfc',
bindings: {
modelId: '=',
submit: '&?',
cancel: '&?'
}
});
Вот вызов в контексте потребления:
vm. $ modalService.openFormModal («контакты», contactId, titleText, функция (форма, модель) {
console.log (форма);
console.log (модель);
});
Вот сервисная функция, открывающая модал через uibModal
function openFormModal(modelName, dataModelId, titleText, submitFunction) {
// convert undefineds to blank strings
titleText = titleText == undefined ? '' : titleText;
dataModelId = dataModelId == undefined ? '' : dataModelId;
var templateString = '<div class="inmodal"><div class="modal-header"><h4 class="modal-title">'
+ titleText
+ '<button class="pull-right btn btn-danger" ng-click="$close()">X</button></h4></div>'
+ '<div class="modal-body" style="overflow:auto;background-color: white !important;padding:0px;">'
+ '<' + modelName + '-form model-id="\'' + dataModelId + '\'" submit="uib.submitFunction(form, model)" cancel="$close()"></' + modelName + '-form></div></div>';
$uibModal.open({
animation: true,
template: templateString,
controller: ['$scope', 'submitFunctionParam', function ($scope, submitFunctionParam) {
var vm = this;
vm.$scope = $scope;
// all this should be unneed.
// it should be the same as vm.submitFunction = submitFunctionParam
if (submitFunctionParam !== undefined) {
vm.submitFunction = submitFunctionParam;
} else { // unneeded but to be explicit
vm.submitFunction = undefined;
}
}],
controllerAs: 'uib',
resolve: {
submitFunctionParam: function () {
return submitFunction;
}
}
})
Но тогда, когда я нахожусь в моем компоненте формы контактов:
function _submit() {
console.log(vm.submit);
if (vm.submit === angular.noop || vm.submit === undefined) {
validate(vm.form);
if (vm.form.$valid) {
//do default updates
var contact = vm.dataModel;
if (vm.contactUrlId) {
vm.$contactsService.updateContact(contact).then(_onUpdateContactSuccess);
} else {
vm.$contactsService.createContact(contact).then(_onCreateNewContactSuccess);
}
} else {
vm.$alertService.warning('Form is invalid. Please fix errors.');
}
} else {
//call function from consuming context
vm.submit({ form : vm.form }, { model : vm.dataModel });
}
};
В моих компонентах у меня есть определенная функция отправки, которая проверяет angular.noop или undefined, но я продолжаю получать эту функцию:
ƒ (locals) {
return parentGet(scope, locals);
}