ion-slide-box 两种方式绑定不起作用答案

【问题标题】：ion-slide-box two way binding not workingion-slide-box 两种方式绑定不起作用
【发布时间】：2016-07-21 13:19:28
【问题描述】：

我在使用 ion-slide-box 时遇到问题

Link to sample not working

我想实现如下两种方式的绑定

Two way binding with out ionic slidebox

任何帮助表示赞赏

谢谢

【问题讨论】：

仍在等待解决方案

标签： angularjs ionic-framework ion-slide-box

【解决方案1】：

我找到了解决方案。可能有更好的方法来解决它，但我现在只能想到这个

我必须稍微修改一下 ion-slide-box 指令

这是我的代码：

Ionic bundle.js（在这里创建双向绑定）

IonicModule.directive('ionSlideBox', [........,
   function(...){
       return{
         scope:{
          counter: "=",
          ...... 
        },
        controller: [.....,function(){
         _this.getCounter = function(){   
            return $scope.counter;   
          }

         _this.setCounter = function(val){
             scope.counter = val;
             $scope.$broadcast( "IncrementValue" );
          }
        }]
   }
}

Directive.js

directive('updateCounter', function(){
return{
    restrict : 'A',
    scope : false,
    require : '^ionSlideBox',
    link : function(scope,element, attrs,ctrl){
        $(element).click(function(){
            scope.counter = ctrl.getCounter();
            scope.counter--;
            ctrl.setCounter(scope.counter);
        })
    }
}})

ViewController.js

$scope.$on(
  "IncrementValue",
  function handleIncrementValue() {
        $scope.counter++;
  }
);
$scope.triggerEvent = function() {
  $scope.$broadcast( "IncrementValue" );
};

View.html

 <ion-slide-box counter="counter">
     <ion-slide>
       <button ng-click="trigger()">Increment box</button>
       <button update-counter>Decrement box</button>
     </ion-slide>
 </ion-slide-box>

如果有更好的方法请告诉我

谢谢

【讨论】：