2016-11-04 3 views
0

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'); 
    }); 
}; 

}); 

버튼을 클릭하면 팝업이 작동하지 않습니다. 나는 그 실수가 어디인지를 모른다.

+0

이 글은 여기서 일하는 것 같다 [codepen] (http://codepen.io/anon/pen/PboXPJ) –

+0

콘솔에서 오류를받을 수 있나요? –

답변

0

이 두 수정하십시오 :

  1. 업데이트 body 태그의 ng-app 속성이 즉 starter.controllers
  2. 는 각 모듈의 이온 프레임 워크를 필요 모듈에 맞게 예 : angular.module('starter.controllers', ['ionic'])

아래 예를 참조하십시오. body 태그를 0123으로 변경했습니다.인데, 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>

관련 문제