Florian Reisinger Florian Reisinger - 4 months ago 24
AngularJS Question

Angularjs material dialog not working

I have an Array of items which I want to output in a dialog. I do not get an error, but it is not working either.

$scope.showDialog = function (ev) {
$mdDialog.alert({
controller: 'DialogController',
controllerAs: 'DiaCtrl',
templateUrl: 'softwareused.tmpl.html',
parent: angular.element(document.body),
targetEvent: ev,
locals: {
items: cvLibsUsed
}
});
};


This should open an alert dialog as pointed out here
When I tried the demo code I got the error, that "alert" is not defined.

The template looks like this:

<md-dialog aria-label="Software used">
<md-dialog-content>
<h2>Software used</h2>
<ul>
<li ng-repeat="cur in locals.items"><a ng-href="{{cur.url}}">{{cur.desc}}</a> - (<a
ng-href="{{cur.licenceUrl}}">{{cur.licence}}</a>
)
</li>
</ul>
</md-dialog-content>
<md-dialog-actions layout="row">
<md-button class="md-icon-button" ng-click="close()" aria-label="Close dialog" md-autofocus>
Close
</md-button>
</md-dialog-actions>




Any idea what I am doing wrong here? No AngularJS error and no dialog.

Thank you :)

Answer

You should use $mdDialog.show Instead of $mdDialog.alert

 $scope.showDialog = function (ev) {
      $mdDialog.show({
        controller: 'DialogController',
        controllerAs: 'DiaCtrl',
        templateUrl: 'softwareused.tmpl.html',
        parent: angular.element(document.body),
        targetEvent: ev,
        locals: {
          items: cvLibsUsed
        }
  });

Here is a sample mdDialog