角度材质：$ 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的怪异行为（未关闭）

回答

相关问题