Question

我希望使用离子框架显示嵌入按钮的自定义通知（就像音乐播放器控件一样），允许用户在点击通知时进行选择。

我无法找到任何关于此的官方（或非官方）文档，我甚至不知道是否可能。

是否有人使用离子框架成功创建了自定义通知模板？

Answer 1

我正在使用带有自定义模板的ionicPopup。

以下是CodePen：http://codepen.io/nicon-dev/pen/EPYeGJ

或：

angular.module('ionicApp', ['ionic'])

.controller('MyCtrl', function($scope, $ionicPopup) {

  $scope.openPopup = function() {

    var customTemplate =
      '<ion-toggle>enable</ion-toggle>' +
      '<label class="item item-input"><input type="text" placeholder="your address"></label>';

    $ionicPopup.show({
      template: customTemplate,
      title: 'alternative location',
      subTitle: 'select this option if GPS is unavailable',
      buttons: [{
        text: 'Cancel',
        //type: 'button-positive',
        onTap: function(e) {

        }
      }, {
        text: '<b>Save</b>',
        type: 'button-positive',
        onTap: function(e) {
          
        }
      }]
    });

  }
});

<html ng-app="ionicApp">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">

  <title>Ionic Pull to Refresh</title>

  <link href="//code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet">
  <script src="//code.ionicframework.com/nightly/js/ionic.bundle.js"></script>

</head>

<body ng-controller="MyCtrl">

  <ion-header-bar class="bar-positive">
    <h1 class="title">Awesome App</h1>
  </ion-header-bar>

  <ion-content class="padding">
    <button class="button button-balanced" ng-click="openPopup()">open popup</button>
  </ion-content>

</body>

</html>

$ ionicPopup docs：HERE

希望这有帮助。

自定义通知模板与离子

1 个答案: