javascript - ionic : how to use cssClass in $ionicPopup?

Question

所以我想修改 $ionicPopup 中的默认宽度，为此我必须将“cssClass”添加到我的弹出对象中，就像下面的代码一样

  $scope.getScore = function(){
  var popupScore = $ionicPopup.alert({

  title:'Score',
  template: 'Total XP points: 50',
  cssClass: '',
  buttons: [{
    text:'Return',
    type: 'button-assertive'
  }]}}

在这种情况下，您将如何处理？我应该给 cssClass 一个值吗？ (即:cssClass = 'popupClass')然后转到我的 CSS 文件并从那里修改宽度？

Answer 1

只需定义一个母类并以这种方式在内部覆盖 .popup 默认 ionic 类

   .my-custom-popup{
      .popup{
        //styling for popup width, width: 300px;
      }
      .popup-title{
        //styling for title
      }
    }

并在 cssClass 中传递 my-custom-popup

 var popupScore = $ionicPopup.alert({

  title:'Score',
  template: 'Total XP points: 50',
  cssClass: 'my-custom-popup',
  buttons: [{
    text:'Return',
    type: 'button-assertive'
  }]}}

这是您可以在父类中覆盖或自定义的类的列表

• .popup

• .popup-head

• .popup-title

• .popup-副标题

• .popup-body

• .popup-buttons.row

• .popup-buttons .button