ionic css過渡配合ng-class做表單的label點擊上移

1、需求描述：
在表單中，點擊input，input中的placeholder上移成爲label標籤
2、代碼：
css :

//表單中的label隨着獲取焦點上移
.label-slide-up{
    font-size: 0.32rem;
    color:#97a6ac;
    transition: all linear 0.5s;
    position: absolute;
    top:18px;
}
.slide{
  font-size: 0.24rem;
  line-height: 0.32rem;
  top:-2px;
}

html

 <label class="item item-input item-stacked-label">
          <span class="input-label label-slide-up {{slide1}}" ng-class="{true:'slide',false:'label-slide-up'}[myModel]">Unit or Apartment Number</span>
          <input name="apartmentNUm" type="text" ng-model="myModel" ng-focus="!myModel&&(slide1 = 'slide')" ng-blur="!myModel&&(slide1='')">
 </label>

這裏面有個需求就是，當model有值時，此時的label應該就是在input上方，不然就跟你的input中的內容重合了（很難看的），，所以我在ng-focus和ng-blur前面都加了判斷條件，即model必須是沒有值，纔給class slide1去賦值，這樣才能達到效果。
看看效果吧：