Угловой материал: странное поведение $ mdDialog (не закрытие)

Я начал очень маленький проект, чтобы немного поиграть с угловым + угловым материалом. Я пытался реализовать $ 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

Возможно, вы используете устаревшую версию углового или углового материала.

источник

2015-11-23 21:18:52 ngDeveloper

Я вижу ... Я использую код внутри приложения Electron, но в основном этот скрипт должен работать в Electron, если он работает в Chrome. Кроме того, я не могу найти что-либо в Google, говоря о том, что Electron + Angular не работает, интегрированная консоль ничего не бросает ... Edit: Я также использую самые последние версии всего, Angular [-animate, -aria ] 1.4.8, Angular-Material 1.0.0-rc4 (также пытался с 0.11.x и 0.10.x) – Zocker3333

Просто, чтобы быть уверенным ... вы включили ngAnimate и ngAria? Требуется по угловому материалу ... довольно уверен, что вы это сделали, если диалог уже открывается. Но кроме того, вам нужно будет увидеть ваш другой код, чтобы увидеть, что может вызвать его. Вы пробовали плункер, это то, как он работает на вашем приложении? – ngDeveloper

Да, я включил их, и plunker работал, это тот же самый код, который я использую, нет других файлов, кроме package.json и style.css, но я уже проверил, style.css, если оставить (за исключением ширины боковой панели) – Zocker3333

Угловой материал: странное поведение $ mdDialog (не закрытие)

ответ

Смежные вопросы