md对话框无效

时间:2016-03-23 15:09:51

标签: angularjs angular-material

我对角度材料很陌生,我试图使$ md-Dialog服务正常工作。我使用角度材料的演示但不知怎的,我似乎无法做到正确。我需要添加什么才能使其正常工作/我做错了什么。

演示 https://material.angularjs.org/latest/api/service/ $ mdDialog

我的HTML

<div ng-controller="myController">
<md-button ng-click="showAlert()" class="md-raised md-warn">Custom Dialog</md-button>
</div>

我的JS

app.controller('myController', ['$scope', '$mdToast', '$animate', '$mdDialog',   '$mdMedia', function ($scope, $mdToast, $mdDialog,$animate, $mdMedia ) {

var alert;
$scope.showAlert = showAlert;
// Internal method
function showAlert() {
  alert = $mdDialog.alert({
    title: 'Attention',
    textContent: 'This is an example of how easy dialogs can be!',
    ok: 'Close'
  });
  $mdDialog
    .show( alert )
    .finally(function() {
      alert = undefined;
    });
}
}

2 个答案:

答案 0 :(得分:2)

这是一个非常常见的问题,但是注入数组中的模块顺序必须与函数参数中模块的顺序相匹配。

改变这个:

app.controller('myController', 
    ['$scope', '$mdToast', '$animate', '$mdDialog', '$mdMedia', 
    function ($scope, $mdToast, $mdDialog, $animate, $mdMedia )

对此:

app.controller('myController', 
    ['$scope', '$mdToast', '$animate', '$mdDialog', '$mdMedia', 
    function ($scope, $mdToast, $animate, $mdDialog, $mdMedia )

答案 1 :(得分:0)

实际上,您不应该手动指定注射名称。使用grunt和Gulp中都有的ng-annotate

https://github.com/olov/ng-annotate

https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#style-y101