이번에는 가격 계산 기능 구현을 위해 AngularJS를 가져왔습니다. AngularJS가 가격 계산 기능을 구현할 때 주의해야 할 주의사항은 무엇인지 살펴보겠습니다.
코드는 다음과 같습니다:
<!DOCTYPE html> <html lang="en" ng-app> <head> <meta charset="UTF-8"> <title>www.jb51.net angular计算总价</title> <link rel="stylesheet" type="text/css" href="style.css" rel="external nofollow" > <script type="text/javascript" src="../libs/angular.min.js"></script> </head> <body> <table> <tr><td>单价:</td><td><input type="text" ng-model="price"></td></tr> <tr><td>数量:</td><td><input type="text" ng-model="number"></td></tr> <tr><td>总价:</td><td>{{price*number|currency:'¥'}}</td></tr> </table> </body> </html>
몇 가지 참고할 사항이 있습니다:
<script type="text/javascript" src="../libs/angular.min.js"></script>
소개 <script type="text/javascript" src="../libs/angular.min.js"></script>
引入angularjs脚本;<html lang="en" ng-app>
声明ng-app;<input type="text" ng-model="price">
数据来自拥有ng-model="price"/ng-model="number"属性的input输入框;<td>{{price*number|currency:'¥'}}
& lt; html lang = "en" ng-apg-app & gt; 상태 <span style="color:#0000ff;">ng-APP</span> <a href="http://www.php.cn/code/120.html" target="_blank"> 입력 유형 = "text" ng- model = "price" & gt; </a>
데이터 출처: ng-model="price"
ng-model="number"
속성;
<td>{{price*number|currency:'엔'}}
의 입력 입력란에서 데이터를 가져온 후 입력 후 {{ }}에서 작업을 수행하면 결과가 td에 표시됩니다. 그 중 |currency:'\'는 숫자를 통화 형식으로 지정할 수 있는 filter
입니다. 지정하지 않으면 기본값은 $입니다.
이 기사의 사례를 읽은 후 방법을 마스터했다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요! 추천 도서:
위 내용은 AngularJS는 가격 계산 기능을 구현합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!