切换切换时发出警报

时间:2016-07-27 18:52:21

标签: javascript angularjs ionic-framework

我想在切换开启和关闭时显示警报,但发现很难。 我按照本教程,但我的工作不应该

http://codepen.io/rossmartin/pen/iwuvC

JS

.controller('shops',['$scope','$http','$timeout',function($scope,$http,$timeout){
  $http.get('http://localhost/site/templates/shop.php').success(function(data){
    $scope.shops=data ;   
    $scope.pushNotificationChange = function() {
    $timeout(function() {
      alert('Push Notification Change: '+ $scope.pushNotification.checked);
    }, 0);
  };
  $scope.pushNotification = { checked: true };
  });
}])

HTML

<ion-view  align-title="center">
  <ion-content overflow-scroll="false" has-bouncing="true" class=padding>
  <ion-list>
    <div ng-controller="shops" ng-repeat="item in shops">
      <ion-item class="item-thumbnail-left item-text-wrap"> 
        <img src="img/index/fashion.png" alt="photo" width="32" height="32" />
        <h2>{{item.shop_name}} </h2>
        <p>{{item.biz_location}}</p>
        <div align="right">
          <label class="toggle toggle-balanced">
          <input type="checkbox"ng-model="pushNotification.checked"
                    ng-change="pushNotificationChange()">
            <div class="track"><div class="handle"></div></div>
          </label>
        </div> 
      </ion-item>
    </div>   
  </ion-list> 
  </ion-content overflow-scroll="false" has-bouncing="true">        
</ion-view>

有关如何使这项工作的任何帮助?

2 个答案:

答案 0 :(得分:1)

你的代码全部在http里面,应该在外面:

.controller('shops',['$scope','$http','$timeout',function($scope,$http,$timeout){
  $http.get('http://localhost/site/templates/shop.php').success(function(data){
     $scope.shops=data;   
  });

  $scope.pushNotificationChange = function() {
    $timeout(function() {
      alert('Push Notification Change: '+   $scope.pushNotification.checked);
    }, 0);
  };
  $scope.pushNotification = { checked: true };    
}])

答案 1 :(得分:0)

试试这个

<ion-view  align-title="center">
  <ion-content overflow-scroll="false" has-bouncing="true" class=padding>
  <ion-list>
   <div ng-controller="shops">
    <div ng-repeat="item in shops">
      <ion-item class="item-thumbnail-left item-text-wrap"> 
        <img src="img/index/fashion.png" alt="photo" width="32" height="32" />
        <h2>{{item.shop_name}} </h2>
        <p>{{item.biz_location}}</p>
        <div align="right">
          <label class="toggle toggle-balanced">
          <input type="checkbox"ng-model="pushNotification.checked"
                    ng-change="pushNotificationChange()">
            <div class="track"><div class="handle"></div></div>
          </label>
        </div> 
      </ion-item>
    </div>
    </div> 
  </ion-list> 
  </ion-content overflow-scroll="false" has-bouncing="true">        
</ion-view>