我在下面写了一个Angular应用程序。应用程序要求用户填写表单并根据答案进行一些计算,一旦用户点击" 获取报价"按钮。单击该按钮时,用户应该看到一个表格,该表格汇总了输入的所有信息,然后在表格底部显示总费用。
我的问题是我不知道如何以表格形式显示摘要,而且我不知道如何显示总费用。我确信我完成了90%,只是这个部分缺失了。我在下面提供了我的代码:
Html 是:
define( 'FTP_USER', 'username' );
define( 'FTP_PASS', 'password' );
define( 'FTP_HOST', 'ftp.example.org:21' );
{{total}} //表格应该放在这里,不知道如何显示用户输入和总费用
JS 文件是:
<div ng-app="demoApp" ng-controller="mainController">
<div class="row">
<pre>{{user | json}}</pre>
<div class="form-group col-md-4">
<label for="company">Company Name*</label><br />
<input type="text" class="form-control" name="company" placeholder="Company Name" ng-model="user.company">
</div>
<div class="form-group col-md-4">
<label for="salesp">Salesperson Name*</label><br />
<input type="text" class="form-control" name="salesp" placeholder="Salesperson Name" ng-model="user.salesp">
</div>
<div class="form-group col-md-4">
<label for="emailsales">Contact Email*</label><br />
<input type="email" class="form-control" name="emailsales" placeholder="john.doe@example.com" ng-model="user.emailsales">
</div>
</div>
<div class="row">
<div class="form-group col-md-4">
<label for="partnum">Number of Part Being Made(Finished Goods)</label>
<input type="number" class="form-control" id ="partnum" name="partnum" placeholder="Enter # items" ng-model="user.partnum">
</div>
<div class="form-group col-md-4">
<label>New Files?</label><br />
<input type="radio" name="files" id="files" value="42" ng-model="user.files"> Yes
<input type="radio" name="files" id="files" value="0"ng-model="user.files"> No
</div>
<div class="form-group col-md-4">
<label>Rerun Files?</label><br />
<input type="radio" name="oldfiles" value="15" ng-model="user.oldfiles"> Yes
<input type="radio" name="oldfiles" value="0" ng-model="user.oldfiles"> No
</div>
</div>
<div class="row">
<div class="form-group col-md-4">
<label for="shortp">Shortest Dimension on Print Part (inches)</label>
<input type="number" class="form-control" name="shortp" placeholder="Shortest Dim" ng-model="user.shortp">
</div>
<div class="form-group col-md-4">
<label for="longp">Longest Dimension on Print Page (inches)</label>
<input type="number" class="form-control" name="longp" placeholder="Longest Dim" ng-model="user.longp">
</div>
<div class="form-group col-md-4">
<label for="pressnum">Number of Ups on Press Sheet</label>
<input type="number" class="form-control" name="pressnum" placeholder="# Ups" ng-model="user.pressnum">
</div>
</div>
<div class="row">
<div class="form-group col-md-4">
<label for="shortpress">Number of Short Press Sheet</label>
<input type="number" class="form-control" id="shortpress" name="shortpress" placeholder="# Short Press" ng-model="user.shortpress">
</div>
<div class="form-group col-md-4">
<label for="longpress">Number of Long Press Sheet</label>
<input type="number" class="form-control" id="longpress" name="longpress" placeholder="# Long Press" ng-model="user.longpress">
</div>
<div class="form-group col-md-4">
<label>Passes First Side?</label><br />
<input type="radio" name="passfirst" value="Yes" ng-model="user.passfirst"> Yes
<input type="radio" name="passfirst" value="No" ng-model="user.passfirst"> No
</div>
</div>
<div class="row">
<div class="form-group col-md-4">
<label for="inkcoverone">Percent of Ink Coverage on First Side</label>
<input type="number" class="form-control" id="inkcoverone" name="inkcoverone" placeholder="% Ink Coverage" ng-model="user.inkcoverone">
</div>
<div class="form-group col-md-4">
<label>Passes Second Side?</label><br />
<input type="radio" name="passsecond" value="1" ng-model="user.passsecond"> Yes
<input type="radio" name="passsecond" value="0" ng-model="user.passsecond"> No
</div>
<div class="form-group col-md-4">
<label for="inkcovertwo">Percent of Ink Coverage on Second Side</label>
<input type="number" class="form-control" name="inkcovertwo" placeholder="% Ink Coverage" ng-model="user.inkcovertwo">
</div>
</div>
<div class="row">
<div class="form-group col-md-offset-10">
<button type="submit" class="btn btn-default btn-block register" ng-click="quoteGenerator()"> GET QUOTE </button>
</div>
</div>