angularJs 遮罩

1.在需要弹出遮罩的地方，写上点击事件，如：ng-click="openModal()"

<!--订单类型-->
<div class="bgffff orderType ub ub-ac ub-pj padding" ng-click="openModal()">
  <div class="ub ub-ac ub-pc">
    <div><img src="img/orderpaper.png" /></div>
    <div>订单类型</div>
  </div>
  <div class="ub ub-ac">
    <div>{{orderType}}</div>
    <img src="img/rs.png" />
  </div>
</div>

2.在该controller中，model的初始化，并且写上该事件的方法

//模板初始化
$ionicModal.fromTemplateUrl('templates/popPage.html',{
  scope:$scope,
  animation:'slide-in-up'
}).then(function(modal){
  $scope.modal = modal;
});

/打开模板
$scope.openModal = function(){
  $scope.modal.show();
};

//关闭模板
$scope.closeModal = function(){
  $scope.modal.hide();
};

//当我们用完模型时，清除它！
$scope.$on('$destroy', function() {
  $scope.modal.remove();
});


3.templateUrl的内容如下

<div class="popPage" >
  <div class="ub ub-pe">
    <img src="img/close.png" ng-click="closeModal();"/>
  </div>
  <div class="padding-left">订单类型</div>
  <div class="padding-left">请选择订单类型</div>
  <ion-scroll class="popPageScroll">
    <ul   ng-repeat="typeItem in typelist" >
      <li class="ub ub-ac ub-pj" ng-click="getValue(typeItem.codename)">
        <div class="typename">{{typeItem.codename}}</div>
        <div class="checkbox-assertive" >
          <div class="checkbox">
            <input type="radio" name="radio" value="{{typeItem.codename}}">
          </div>
        </div>
      </li>
    </ul>
  </ion-scroll>
</div>