onsen ui button-bar的用法尝试

效果图：

html 中的代码：

     	<div style="width:100%; background:lightgray; padding:10px 0px;">
				<div class="button-bar" style="margin:0px auto;float: left">
				  <div class="button-bar__item showThis" ng-click="events.sending(1)">
                                        <button class="button-bar__button" ng-class="{'button-active':switchStatus==1}">正在发送</button>
				  </div>

				  <div class="button-bar__item showLast" ng-click="events.alreadySend(2)">
					<button class="button-bar__button" ng-class="{'button-active':switchStatus==2}">已发送</button>
				  </div>

				  <div class="button-bar__item showLast" ng-click="events.wailtSend(3)">
					<button class="button-bar__button" ng-class="{'button-active':switchStatus==3}">待发送</button>
				  </div>
                                <div class="button-bar__item showLast" ng-click="events.alreadySave(4)">
					<button class="button-bar__button" ng-class="{'button-active':switchStatus==4}">已保存</button>
				  </div>

				  <div class="button-bar__item showLast" ng-click="events.failSend(5)">
					<button class="button-bar__button" ng-class="{'button-active':switchStatus==5}">发送失败</button>
				  </div>
				</div>
	</div>

在typescript中的代码：

 sending(status:number){
         let $log = this.$log;
        let $ocLazyLoad = this.$ocLazyLoad;
        let $window = this.$window;
        let $scope = this.$scope;
       $scope.switchStatus = status;
       $log.debug( $scope.switchStatus+" $scope.switchStatus");
    };
      alreadySend(status:number){
         let $log = this.$log;
        let $ocLazyLoad = this.$ocLazyLoad;
        let $window = this.$window;
        let $scope = this.$scope;
        $scope.switchStatus = status;
          $log.debug( $scope.switchStatus+" $scope.switchStatus");
    };
      wailtSend(status:number){
         let $log = this.$log;
        let $ocLazyLoad = this.$ocLazyLoad;
        let $window = this.$window;
        let $scope = this.$scope;
        $scope.switchStatus = status;
          $log.debug( $scope.switchStatus+" $scope.switchStatus");
    }
      alreadySave(status:number){
         let $log = this.$log;
        let $ocLazyLoad = this.$ocLazyLoad;
        let $window = this.$window;
        let $scope = this.$scope;
        $scope.switchStatus = status;
          $log.debug( $scope.switchStatus+" $scope.switchStatus");
    }  
     failSend(status:number){
         let $log = this.$log;
        let $ocLazyLoad = this.$ocLazyLoad;
        let $window = this.$window;
        let $scope = this.$scope;
        $scope.switchStatus = status;
          $log.debug( $scope.switchStatus+" $scope.switchStatus");
    }