打印表格提交

Printing out form submission

本文关键字：提交 表格 打印      更新时间：2023-09-26

我想打印出一个已由用户填写的表单。但是，当按下打印按钮时，只打印输入的默认值。我用的是角。有人知道如何打印出填写表单，而不必追加每个输入字段(我有很多)到doctopprint .document.write?

$rootScope.printDiv = function(divName) {
                var printContents = document.getElementById(divName).innerHTML;
                var docToPrint = window.open('', '_blank', 'width=700,height=400');
                docToPrint.document.open();
                docToPrint.document.write('<html><head><link rel="stylesheet" type="text/css"/></head><body onload="window.print()">' + printContents + '</html>');
                docToPrint.document.close();
};

我不知道这是否符合你的要求，但我有这个

 ng-click="window.print();"

这打开了打印屏幕的所有视图，从那里你可以打印它

在angular中，我们有$scope的概念，它位于控制器和视图之间。你能做的是，在控制器中创建一个表单模型并为每个字段设置一些默认值。现在创建一个表单，并将该模型与它绑定。每个字段都会用控制器中给定的默认值填充。现在，当您按下打印按钮时，模型将具有所有更新的值，其余将是默认值。

示例如下:

h2控制器

angular.module('mainModule', [])
.conroller('formCntrl', function($scope) {
   $scope.model = {
      name: 'Dummy Name',  // these are some default values
      age: 20,
      address: 'XyZ',
      profession: 'Abc'
   };
   $scope.submitForm = function() {
      /* here you can play with $scope.model which will have all updated values and if any field is not touched then it will have default value for it which is given above  */
   };
});

html 

<html>
<body ng-app="mainModule">
   <div ng-controller="formCntrl">
   <form name="regForm">
     Name: <input type="text" ng-model="model.name" name="name" /><br>
     Age: <input type="text" ng-model="model.age" name="name" /><br>
     Address: <input type="text" ng-model="model.address" name="name" /><br>
     Profession: <input type="text" ng-model="model.profession" name="name"/><br>
    <input type="button" value="Print" ng-click="submitForm()" />
   <form>
   </div>
</body>
</html>

这将符合您的要求。https://dzone.com/articles/building-simple-angularjs 

     myApp.controller('LoginCtrl', function($scope,$window) {
         $scope.print=function(){       
         $window.print();
       }
相关文章：