角度材質：$ mdDialog的怪異行爲（未關閉）

我已經開始了一個非常小的項目，可以與Angular + Angular Material玩點兒。我一直在試圖實現一個$ mdDialog，但它不起作用。對話框可以通過指定的按鈕打開，但關閉部分不起作用。我按下應該關閉對話框的按鈕，幾秒鐘內沒有任何反應，然後關閉，打開對話框的按鈕不能再按下了......我真的不知道這裏發生了什麼。這些都是文件：

<!Doctype html> 
<html> 
    <head> 
    <title>Some App</title> 
    <link rel="stylesheet" type="text/css" href="style.css"/> 
    <!--<link rel="stylesheet" href="../node_modules/angular-material/angular-material.css">--> 
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0-rc4/angular-material.min.css"> 
    <script src="../node_modules/angular/angular.js"></script> 
    <script src="../node_modules/angular-aria/angular-aria.js"></script> 
    <script src="../node_modules/angular-animate/angular-animate.js"></script> 
    <!--<script src="../node_modules/angular-material/angular-material.js"></script>--> 
    <script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0-rc4/angular-material.min.js"></script> 
    <script src="script.js"></script> 
    </head> 
    <body layout="row" ng-app="SomeApp" ng-controller="MainCtrl"> 
    <md-sidenav md-is-locked-open="true" md-component-id="left" class="md-sidenav-left md-whiteframe-z2" style="width:200px"> 
     <md-list layout="column"> 
     <md-subheader class="md-no-sticky">Items</md-subheader> 
     <md-list-item ng-repeat="item in items" ng-click="$parent.activeItem = item"> 
      {{item}} 
     </md-list-item> 
     <md-button ng-click="askNewItem($event)" class="md-raised" layout-align="center center">ADD NEW ITEM</md-button> 
     </md-list> 
    </md-sidenav> 
    <md-content> 
     This is {{activeItem}} 
    </md-content> 
    </body> 
</html>

，並：

angular.module('SomeApp', [ 'ngMaterial' ]) 
    .controller('MainCtrl', function($scope, $mdDialog, $mdSidenav) { 
    $scope.activeItem = "1"; 
    $scope.items = [ 
     "1", 
     "2", 
     "3", 
     "4", 
     "5", 
     "6", 
     "7" 
    ]; 

    $scope.askNewItem = function($event) { 
     var parentEl = angular.element(document.body); 
     $mdDialog.show({ 
     controller: DialogController, 
     parent: parentEl, 
     targetEvent: $event, 
     template: 
      '<md-button class="md-raised" ng-click="hide()" class="md-primary">CLOSE</md-button>' 
     }); 
    }; 

    function DialogController($scope, $mdDialog) { 
     $scope.hide = function() { 
     $mdDialog.hide(); 
     }; 
     $scope.close = function() { 
     $mdDialog.cancel(); 
     }; 
    } 
    });

我只是無法找到錯誤...任何想法？謝謝。

來源

2015-11-23 Zocker3333

我把你的代碼直接放入plunker and it works。所以你發佈的代碼沒有問題。也許在瀏覽器中查看控制檯是否有其他潛在的錯誤消息

//would not let me post plunker link without a code block

也許您正在使用Angular或Angular Material的過期版本。

來源

2015-11-23 21:18:52 ngDeveloper

我看到......我使用的是Electron應用程序中的代碼，但基本上，如果它在Chrome中運行，此腳本應該可以在Electron中運行。另外，我在Google上找不到任何提及Electron + Angular不起作用的東西，集成控制檯也不會拋出任何東西......編輯：我也使用最新版本的所有東西，Angular [-animate，-aria ] 1.4.8，Angular-Material 1.0.0-rc4（也用0.11.x和0.10.x試用） – Zocker3333

只要確定...你是否包含ngAnimate和ngAria？角材料需要...非常確定你做了，如果對話框已經打開。但除此之外，需要查看其他代碼以查看可能導致該問題的原因。你有沒有試過這種笨蛋，它是如何在你的應用中起作用的？ – ngDeveloper

是的，我確實包含了它們，並且調用者工作，這與我正在使用的完全相同的代碼，除了package.json和style.css之外，沒有其他文件，但是我已經檢查了style.css，如果離開（不包括邊欄的寬度） – Zocker3333

角度材質：$ mdDialog的怪異行爲（未關閉）

回答

相關問題