イオンポップアップテンプレートの内容がポップアップウィンドウに修正されない

Question

ポップアップを使用してその中のリストを表示しようとしています。リストには多くの項目が含まれます。私がこれをしようとするとき、リストはデバイスのポップアップメニューに修正されていません。それはブラウザで完璧に動作しています。デバイス内での表示は、次の画像のようになります。 Mobile user interface

これは

.controller('taskCtrl', function ($scope, $http, $ionicPopup) { 

$scope.tasksList = function() { 
    $scope.listdata = []; 
    for (var i = 0; i < 100; i++) { 
    $scope.listdata.push(i) 
    } 
    var myPopup = $ionicPopup.show({ 
    template: ' <style>.popup { width:500px; height:50%; }</style> <ion-list>       ' + 
    ' <ion-item ng-repeat="item in listdata"> ' + 
    ' {{item.id}}        ' + 
    ' </ion-item>        ' + 
    '</ion-list>        ', 
    title: 'Current Tasks', 
    scope: $scope, 
    buttons: [ 
     { 
     text: '<b>Close</b>', 
     type: 'button-positive', 
     onTap: function (e) { 
      myPopup.close(); 
     } 
     }, 
    ] 
    }); 
    myPopup.then(function (res) { 
    console.log('Tapped!', res); 
    }); 
}; 
}) 

私のコントローラでは、誰かが問題をそれを把握することができます願っています。ありがとうございました

Answer 1

overflowプロパティは、.popup-bodyクラスの問題である可能性があります。テンプレート文字列やカスタムCSSファイルの下にスタイルを追加してみてください。

.platform-android .pop-up .popup-body{ 
    overflow : overlay; 
}