In the controller, the section responsible for spawning mdDialog appears as follows:
$scope.removeAttendee = function(item) {
console.log(item);
$mdDialog.show({
controller: DialogController,
templateUrl: 'views/removeMsg.tmpl.html',
parent: angular.element(document.body),
clickOutsideToClose:true,
controllerAs: 'ctrl',
fullscreen: $scope.customFullscreen, // Only for -xs, -sm breakpoints.
locals: {item: item}
})
The controller for mdDialog is defined as:
function DialogController($scope, $mdDialog) {
var attendee = this;
$scope.hide = function() {
$mdDialog.hide();
};
$scope.cancel = function() {
$mdDialog.cancel();
};
$scope.save = function(response) {
$mdDialog.hide(response);
};
$scope.remove = function(response) {
$mdDialog.hide(response);
};
}
The template file removeMsg.tmpl.html contains the following code:
<p>You are going to remove {{ ctrl.item.firstName }} {{ ctrl.item.lastName }} from the lunch list.</p>
Despite making changes in the code like
locals { item: "test" }
and echoing out the value using
{{ ctrl.item }}
I'm still facing difficulties in displaying the related values. Any insights on why these values are not being displayed?