以离子形式打印应用页面

时间:2017-04-24 04:08:48

标签: angularjs ionic-framework

我正在尝试以离子方式打印页面。打印按钮在chrome中工作,但它在android / device中不起作用。

是否可以在离子中打印当前显示的页面?我应该怎么做呢?

这是我要打印的页面的代码:

 <ion-view title="Review New Member Info" id="page6" style="background-color:#162c51;">
 <ion-content padding="true" class="has-header">
<div>
  <img src="img/kYYXJ9o0Qk6yNSgx8ZLb_imgpsh_fullsize.jpg" style="display: block; width: 100%; height: auto; margin-left: auto; margin-right: auto;">
</div>
 <!-- <div class="spacer" style="height: 40px;"></div>
  <div class="spacer" style="height: 40px;"></div>-->
  <h4 style="color: #fff">Step 3.) Review Member's Information and Submit</h4>
  <div align="center">
  <!--<img id="smallImage" height="1024" width="768" src="{{imageCapture}}"/>-->
   <img src="{{imageCapture}}" id="smallImage" style="height: 30%; width: 30%; object-fit: contain">
  </div>

  <form="myForm">
  <div class="row">
      <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3" readonly ng-model="mmid" class="form-control">
      </div>
      <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3" readonly  ng-model="cardNumber" class="form-control">
      </div>
  </div>

  <div class="row">
    <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3"  readonly  ng-model="fname" class="form-control" >
    </div>
    <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3"   readonly ng-model="gender" class="form-control">
    </div>
  </div>

  <div class="row">
    <div class="col-xs-6">
         <input type="text" style="background-color:#d3d3d3"  readonly  ng-model="mname" class="form-control">
    </div>
    <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3"  readonly ng-model="birthplace" class="form-control">
    </div>
  </div>

   <div class="row">
    <div class="col-xs-6">
          <input type="text" style="background-color:#d3d3d3" readonly   ng-model="lname" class="form-control">
    </div>
    <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3" readonly  ng-model="citizenship" class="form-control">
    </div>
  </div>

  <div class="row">
    <div class="col-xs-6">
          <input type="text" style="background-color:#d3d3d3" readonly  ng-model="bday" class="form-control" >
    </div>
    <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3" readonly  ng-model="sssTinID" class="form-control">
    </div>
  </div>

  <div class="row">
    <div class="col-xs-6">
        <input  type="email" style="background-color:#d3d3d3" readonly  ng-model="email" class="form-control">
    </div>
    <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3" readonly ng-model="companyName" class="form-control">
    </div>
  </div>

  <div class="row">
    <div class="col-xs-6">
         <input type="text" style="background-color:#d3d3d3" readonly ng-model="mobile" class="form-control">
    </div>
    <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3" readonly  ng-model="companyAddress" class="form-control" >
    </div>
  </div>

  <div class="row">
    <div class="col-xs-6">
          <!--<input type="text" style="background-color:#d3d3d3" readonly ng-model="address" class="form-control">-->
          <textarea name="textarea" readonly ng-model="address" class="form-control" ></textarea>
    </div>
    <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3" readonly ng-model="workTitle" class="form-control">
    </div>
  </div>

  <div class="row">
    <div class="col-xs-6">
         <input type="text" style="background-color:#d3d3d3" readonly  ng-model="city" class="form-control" >
    </div>
    <div class="col-xs-6">
         <input type="text" style="background-color:#d3d3d3" readonly ng-model="srcFunds" class="form-control">
    </div>
  </div>

  <div class="row">
    <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3" readonly ng-model="zipcode" class="form-control" >
    </div>
    <div class="col-xs-6">
        <input type="text" style="background-color:#d3d3d3" readonly ng-model="otherSrcFunds" class="form-control" >
    </div>
  </div>
  </form>




  <div class="spacer" style="height: 3px;"></div>
  <button ng-click="goSubmit(userdata.fname,userdata.mname,userdata.lname,userdata.bday,userdata.email,userdata.mobile,userdata.addr,userdata.zipcode)" id="review-button1" class="button button-assertive  button-block">Submit</button>
  <div class="spacer" style="height: 3px;"></div> 
  <!--<div>
    <img src="img/y1pHZHQQjSNii05shKd1_travelcard.jpg" style="display: block; width: 100%; height: auto; margin-left: auto; margin-right: auto;">
  </div>-->
  <h5 id="login-heading3" style="color:#F8F3F3;text-align:center;">All rights reserved 2017 - Omnipay for PAL</h5>
</form>

这是同一页面上的打印按钮:

 <a href="javascript:window.print()" class="button button-assertive button-block" style="margin-bottom:20px;">Print</a>

0 个答案:

没有答案