저는 두 개의 버튼을 포함하고있는 대화 상자 자체의 사용자 정의 템플릿에 액세스하기 위해 templateUrl 속성이있는 사용자 정의 지시문에서 $ mdDialog.show()를 사용했습니다. '취소'버튼과 '확인'버튼이 있습니다.
이들 각각에 대해 'cancelLeaver()'및 'confirmLeaver()'함수를 호출 할 때 ng-click을 추가했습니다.이 함수는 지시문에 쓸 수 있어야하지만 어떻게 사용합니까? 할것이다.
$ mdDialog.then() 기능을 사용하려고 시도했지만 맞춤보기 템플릿에 버튼이 있기 때문에 작동하지 않았습니다.
별도의 지시문 안에 작성된 뷰 템플릿의 ng-click 속성에서 함수를 호출하려면 어떻게해야합니까?
HTML :
<md-dialog ng-controller="mainController" style="min-width: 30vw">
<md-dialog-content>
<h2 class="md-title">Confirm leaver status</h2>
</md-dialog-content>
<md-dialog-content class="minus-padding-top">
<p>Enter employee's leave date below</p>
<br>
<md-input-container class="md-prompt-input-container">
<input id="leaveDate" name="leaveDate" ng-model="employee.leaveDate" ng-init="employee.leaveDate = currentDate" aria-label="Leave Date" required>
</md-input-container>
</md-dialog-content>
<md-dialog-actions>
<md-button ng-click="cancelLeaver()">Cancel</md-button>
<md-button ng-click="confirmLeaver()" ng-disabled="!employee.leaveDate.length">Confirm</md-button>
</md-dialog-actions>
</md-dialog>
지침 :.
app.directive('makeLeaver', function($window, $mdDialog, $mdToast, $timeout, $state) {
return {
restrict: 'A',
scope: {
employee: '=',
},
controller: 'employeeDetailsController',
controllerAs: 'employeeDetails',
bindToController: true,
link: function(scope, element, attrs) {
element.bind('click', function() {
console.log('makeLeaver(' + '#' + scope.employee.id + ')');
/* Show confirmation prompt dialog */
$mdDialog.show({
parent: angular.element('body'),
clickOutsideToClose: true,
templateUrl: 'views/employees/employeeDetails/dialogs/makeLeaver.html',
targetEvent: element
})
/* ---------------- TRIED THIS BUT DIDN'T WORK ---------------- */
scope.cancelLeaver = function() {
console.log('cancelLeaver()');
$mdDialog.hide();
}
scope.confirmLeaver = function() {
console.log('confirmlLeaver()');
}
})
}
}
})