離子彈出爲什麼不起作用？

我正在創建一個AngularJS + Ionic應用程序，並試圖在用戶單擊按鈕時顯示彈出消息。離子彈出爲什麼不起作用？

這是index.html的：

 <body ng-app="starter"> 
     <ion-content ng-controller="HomeCtrl"> 
     <button class="button button-block button-positive" ng-click="showpop()"> 
     <i class="icon ion-ionic"></i> 
</ion-content> 

     </body>

，這是控制器。我沒有輸入真實的數據。

angular.module('starter.controllers', []) 
.controller('HomeCtrl', function($scope, $ionicPopup , $timeout) { 

    $scope.showpop = function() { 
    var alertPopup = $ionicPopup.alert({ 
    title: 'Don\'t eat that!', 
    template: 'It might taste good' 
    }); 

    alertPopup.then(function(res) { 
    console.log('Thank you for not eating my delicious ice cream cone'); 
    }); 
}; 

});

當我點擊按鈕時，彈出不起作用。我不知道錯誤在哪裏。

來源

2016-11-04 ca2264

它似乎在這裏工作在[codepen（http://codepen.io/anon/pen/PboXPJ） –

你在控制檯中的任何錯誤？ –

嘗試這兩個修飾：

更新body標籤的ng-app屬性到模塊匹配即starter.controllers
要求的角模塊上的離子框架即：angular.module('starter.controllers', ['ionic'])

請參閱下面的示例（我將body標記更改爲div，因爲body標籤（目前）不允許在SO樣本中）。

//require the ionic module 
 
angular.module('starter.controllers', ['ionic']) 
 
    .controller('HomeCtrl', function($scope, $ionicPopup, $timeout) { 
 

 
    $scope.showpop = function() { 
 
     var alertPopup = $ionicPopup.alert({ 
 
     title: 'Don\'t eat that!', 
 
     template: 'It might taste good' 
 
     }); 
 

 
     alertPopup.then(function(res) { 
 
     console.log('Thank you for not eating my delicious ice cream cone'); 
 
     }); 
 
    }; 
 

 
    });

<link href="//code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet"> 
 
<script src="http://code.ionicframework.com/1.3.2/js/ionic.bundle.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<!-- update the ng-app here to match the module name in the javascript code--> 
 
<div ng-app="starter.controllers"> 
 
    <ion-content ng-controller="HomeCtrl"> 
 
    <button class="button button-block button-positive" ng-click="showpop()"> 
 
     <i class="icon ion-ionic"></i> 
 
    </ion-content> 
 

 
</div>

來源

2016-11-04 21:11:13

離子彈出爲什麼不起作用？

回答

相關問題