angularjs 對話框似乎對我不起作用

Question

我一直在嘗試在我的應用程序中實現 AngularJS 對話框，我從material.angularjs.org中提供的演示中復制了所有內容，但是我似乎無法讓它工作。 誰能看到我錯過了什么？

這是Javascript代碼：

  // TABLE CONTROLLS GO HERE 
app.controller('AddTableController',['$scope', function($scope,$mdDialog){
        $scope.allTables = tables;
        //method to add tables 
        $scope.showAdvanced= function(ev) {
            $mdDialog.show({
              controller:DialogController,
              templateUrl:'index_directives/dialog-add-table.html',
            })
        };
}]);
//HELPER METHOD FOR THE AddTableController//////////////////////////////
function DialogController($scope, $mdDialog) {
  $scope.hide = function() {
    $mdDialog.hide();
  };
  $scope.cancel = function() {
    $mdDialog.cancel();
  };
  $scope.answer = function(answer) {
    $mdDialog.hide(answer);
  };
}

然后在按鈕單擊時調用該函數：

<md-button class="md-fab add-button" ng-click="showAlert($event)">+</md-button>

從控制台中的錯誤日志中，我得到如下信息：

TypeError: Cannot read property 'show' of undefined
    at n.app.controller.$scope.showAlert (http://localhost/angular/js/app.js:24:16)
    at ib.functionCall (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:199:303)
    at Ec.(anonymous function).compile.d.on.f (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:216:74)
    at n.$get.n.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:126:15)
    at n.$get.n.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js:126:241)

Answer 1

您忘記定義 $mdDialog 依賴項：

app.controller('AddTableController',['$scope', '$mdDialog', function($scope,$mdDialog){

由於忘記定義依賴注入是很常見的，您可能對@Michael Benford 關於 ng-annotate 的這個建議感興趣。