ng-html-to-pdf-save不适用于波斯语或阿拉伯语字符

时间:2016-12-20 13:03:53

标签: javascript html css angularjs

我有一个波斯语内容,并希望使用此模块打印它,我遇到的问题是它没有以正确的char格式显示内容。 这就是我在代码中所做的: -

<script type="text/ng-template" id="patient_modal.html">
    <div class="modal-header">
        <button type="button" class="close" ng-click="close_patient()">&times;</button>
        <h4 class="modal-title text-center" id="patient-title">اطلاعات بیمار</h4>
    </div>
    <div class="modal-body" id="patient-body" pdf-save-content="idOne">
        <div class="row" id="print_body">
            <div class="panel panel-info">
                <div class="panel-heading text-center">مشخصات بیمار</div>
                <div class="panel-body">

                        <div class="row form-group">
                            <label class="col-sm-6  col-xs-12 col-form-label">نام :</label>
                            <div class="col-sm-6 col-xs-12">{{p.first_name}}</div>
                        </div>
                    <div class="row form-group">
                        <label class="col-sm-6  col-xs-12 col-form-label">نام خانوادگی :</label>
                        <div class="col-sm-6 col-xs-12">{{p.last_name}}</div>
                    </div>
                    <div class="row form-group">
                        <label class="col-sm-6  col-xs-12 col-form-label">شماره پرونده :</label>
                        <div class="col-sm-6 col-xs-12">{{p.document_id}}</div>
                    </div>
                    <div class="row form-group">
                        <label class="col-sm-6  col-xs-12 col-form-label">بیمه :</label>
                        <div class="col-sm-6 col-xs-12">{{p.insurance}}</div>
                    </div>
                    <div class="row form-group">
                        <label class="col-sm-6  col-xs-12 col-form-label">تعداد مراجعات :</label>
                        <div class="col-sm-6 col-xs-12">{{p.count}}</div>
                    </div>
                    <div class="row form-group">
                        <label class="col-sm-6  col-xs-12 col-form-label">تاریخ آخرین مراجعه :</label>
                        <div class="col-sm-6 col-xs-12">{{p.last_reservation}}</div>
                    </div>


                </div>
            </div>

        <div class="row">
            <div class="table-responsive ">
                <table class="table table-bordered">
                    <thead>
                    <tr>
                        <th class="text-center">تاریخ</th>
                        <th class="text-center"> نوع خدمت</th>
                        <th class="text-center"> مطب</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr data-ng-repeat="row in info">
                        <td class="text-center">{{row.date}}</td>
                        <td class="text-center">{{row.service}}</td>
                        <td class="text-center">{{row.clinic}}</td>
                    </tr>

                    </tbody>
                </table>
            </div>
        </div>
        </div>
        <div class="row">
            <button class="btn btn-info center-block" id="btnSave" pdf-save-button="idOne" pdf-name="someone.pdf">
                <div class=" glyphicon glyphicon-save"></div>
                <label> ذخیره اطلاعات</label>
            </button>
        </div>

    </div>
    <div class="modal-footer">
        <button class="btn btn-info center-block" type="button" ng-click="close_patient()">بستن</button>

    </div>
</script>

此代码显示的内容如下: enter image description here

但它显示如下: enter image description here

1 个答案:

答案 0 :(得分:1)

据我所知,问题似乎是从上面写的HTML中删除了顶部和底部的一些内容。 为了解决这个问题,我将整个内容包装在另一个div中,并在其上放置了pdf-save-content指令。如果我不能很好地理解这个问题,请纠正我。 这是相同的代码和plunker。

<div pdf-save-content="idOne">
    <div class="modal-header">
      <button type="button" class="close" ng-click="close_patient()">×</button>
      <h4 class="modal-title text-center" id="patient-title">اطلاعات بیمار</h4>
    </div>
    <div class="modal-body" id="patient-body">
      <div class="row" id="print_body">
        <div class="panel panel-info">
          <div class="panel-heading text-center">مشخصات بیمار</div>
          <div class="panel-body">
            <div class="row form-group">
              <label class="col-sm-6  col-xs-12 col-form-label">نام :</label>
              <div class="col-sm-6 col-xs-12">{{p.first_name}}</div>
            </div>
            <div class="row form-group">
              <label class="col-sm-6  col-xs-12 col-form-label">نام خانوادگی :</label>
              <div class="col-sm-6 col-xs-12">{{p.last_name}}</div>
            </div>
            <div class="row form-group">
              <label class="col-sm-6  col-xs-12 col-form-label">شماره پرونده :</label>
              <div class="col-sm-6 col-xs-12">{{p.document_id}}</div>
            </div>
            <div class="row form-group">
              <label class="col-sm-6  col-xs-12 col-form-label">بیمه :</label>
              <div class="col-sm-6 col-xs-12">{{p.insurance}}</div>
            </div>
            <div class="row form-group">
              <label class="col-sm-6  col-xs-12 col-form-label">تعداد مراجعات :</label>
              <div class="col-sm-6 col-xs-12">{{p.count}}</div>
            </div>
            <div class="row form-group">
              <label class="col-sm-6  col-xs-12 col-form-label">تاریخ آخرین مراجعه :</label>
              <div class="col-sm-6 col-xs-12">{{p.last_reservation}}</div>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="table-responsive ">
            <table class="table table-bordered">
              <thead>
                <tr>
                  <th class="text-center">تاریخ</th>
                  <th class="text-center"> نوع خدمت</th>
                  <th class="text-center"> مطب</th>
                </tr>
              </thead>
              <tbody>
                <tr data-ng-repeat="row in info">
                  <td class="text-center">{{row.date}}</td>
                  <td class="text-center">{{row.service}}</td>
                  <td class="text-center">{{row.clinic}}</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
      <div class="row">
        <button class="btn btn-info center-block" pdf-save-button="idOne" pdf-name="someone.pdf" id="btnSave">
          <div class=" glyphicon glyphicon-save"></div>
          <label> ذخیره اطلاعات</label>
        </button>
      </div>
    </div>
    <div class="modal-footer">
      <button class="btn btn-info center-block" type="button" ng-click="close_patient()">بستن</button>
    </div>

  </div>

创造了相同的plunker, https://plnkr.co/edit/G3PDqIRLkWcwes4pw7dR?p=preview

以下是上面的plunker和保存的PDF的HTML图片。 enter image description here 这是保存的PDF的图片。 enter image description here