0

我的模式代码在这里

$ionicModal.fromTemplateUrl('my-modal.html', {
    scope: $scope,
    animation: 'slide-in-up'
  }).then(function(modal) {
    $scope.modal = modal;
  });

我的按钮和功能代码在这里（模态按钮）

<button class="button button-icon ion-ios-star-outline rate" ng-repeat='i in rate_num' ng-click='rateStar(i)'></button>//rate_num = [1,2,3,4,5];

$scope.rateStar = function(n){
      console.log(n);
      $rootScope.rate = n;
    };

它工作正常，没有模态。但是模态它不起作用。

当我单击该按钮时，我想 console.log(Number); 例如）当我单击第一个按钮时，我想要 console.log(1)，然后单击第二个 -> console.log(2).. 等等

但是现在该代码仅运行 console.log(1) -> 仅调用第一个元素...哪里错了...？

4

1 回答 1

0

尝试这个：

索引.html：

<body ng-app="starter">
    <ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">Ionic Blank Starter</h1>
      </ion-header-bar>
      <ion-content ng-controller="ModalDemoController">
        <button ng-click="showModal()">Show</button>
      </ion-content>
    </ion-pane>
  </body>
  <script id="my-modal.html" type="text/ng-template">
  <ion-modal-view>
    <ion-header-bar class="dark">
      <h1 class="title">Modal Demo</h1>
      <button class="button button-clear ion-close" ng-click="closeModal()"></button>
    </ion-header-bar>
    <ion-content class="content-stable">
        <button  ng-repeat='i in rate_num' class="button button-icon ion-ios-star-outline rate"  ng-click='rateStar(i)'> {{i}}</button>
      </ion-content>
  </ion-modal-view>
</script>

和控制器：

.controller('ModalDemoController', function($scope,$ionicModal) {

    $ionicModal.fromTemplateUrl('my-modal.html', {
      scope: $scope,
      animation: 'slide-in-up'
    }).then(function(modal) {
      $scope.modal = modal;
    });
    $scope.rate_num = [1,2,3,4,5];
    $scope.showModal = function() {
      $scope.modal.show();
    };

    $scope.closeModal = function() {
      $scope.modal.hide();
    };    
    $scope.rateStar = function(n){
      console.log(n);
      $scope.rate = n;
    };
});

希望这会帮助你。

于 2015-12-01T04:41:13.423 回答