2016-07-29 25 views
0

我正在創建一個移動應用程序,其中當您單擊某個按鈕並彈出一個對話框窗口時。我的問題是,這個窗口沒有響應,我不能改變它的CSS。無法在angularjs上應用CSS對話框

下面的代碼:

Controller.js

.controller('jargonController', ['$scope','$mdDialog','$mdMedia',function ($scope, $mdDialog, $mdMedia){ 

$scope.status = ' '; 

    $scope.showTabwtr = function(ev) { 
    $mdDialog.show({ 
     controller: DialogController, 
     templateUrl: 'templates/jargon/wtr.tmpl.html', 
     parent: angular.element(document.body), 
     windowClass: 'center-modal', 
     targetEvent: ev, 
     clickOutsideToClose:true 
    }) 
     .then(function(answer) { 
      $scope.status = 'You said the information was "' + answer + '".'; 
     }, function() { 
      $scope.status = 'You cancelled the dialog.'; 
     }); 
    } 

的Index.html

<div class="col col-50" > 
    <img src="img/jargon/Image13.png" ng-click="showTabwtr($event)" style="width: 100%; height: auto"/> 
</div> 

模板

<div class="modall"> 
    <img style="max-width:200px; max-height:100px"src="img/description/Image17.png"/> 
</div> 

CSS

.modall { 

    margin: auto; 
    position: relative; 
    max-width: 200px; 
    max-height: 80px; 
    background: transparent; 
} 
+0

你能預見Plunkr,......,好嗎? –

+0

看看這個頁面。 '複雜對話框的大小可以用flex =「percentage」來表示,即flex =「66」' https://material.angularjs.org/latest/api/service/$mdDialog – ksav

+0

謝謝。但那只是改變高度而已。寬度呢? – Hana

回答

0
$scope.showTabwtr = function(ev) { 
    $mdDialog.show({ 
     controller: DialogController, 
     templateUrl: 'templates/jargon/wtr.tmpl.html', 
     parent: angular.element(document.body), 
     windowClass: 'center-modal', 
     targetEvent: ev, 
     cssClass: 'your css name', 
     clickOutsideToClose:true 
    }) 

使用此cssClass財產

相關問題