前端之家收集整理的这篇文章主要介绍了
angularjs-ng-cloak 解决闪屏问题，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
- #使用ng-cloak及样式.ng-cloak
- <!DOCTYPEhtml>
- <html>
- <head>
- <Metacharset="UTF-8">
- <title></title>
- <scripttype="text/javascript"src='js/angular.min.js'></script>
- <styletype="text/css">
- .ng-cloak{display:none;}
- </style>
- </head>
- <bodyng-app="hd"ng-cloakclass="ng-cloak">
- <divng-controller="ctrl">
- <!--商品名称：{{goods.name}}<br/>
- 商品价格：{{goods.price}}<br/>
- 商品数量：{{goods.num}}<br/>
- 商品总价：{{goods.price*goods.num}}<br/>
- <inputtype="button"value="+"ng-click="add()"/>
- <inputtype="button"value="-"ng-click="reduce()"/>-->
- 商品名称：{{goods.data.name}}<br/>
- 商品价格：{{goods.data.price}}<br/>
- 商品数量：{{goods.data.num}}<br/>
- 商品总价：{{goods.data.price*goods.data.num}}<br/>
- <inputtype="button"value="+"ng-click="goods.add()"/>
- <inputtype="button"value="-"ng-click="goods.reduce()"/>
- </div>
-
- <scripttype="text/javascript">
- varm=angular.module('hd',[])
- m.controller('ctrl',['$scope',function($scope){
- //$scope.goods={'name':'iphone','price':3000,'num':0}
- //$scope.add=function(){$scope.goods.num=Math.min(++$scope.goods.num,6)}
- //$scope.reduce=function(){$scope.goods.num=Math.max(--$scope.goods.num,0)}
- $scope.goods={
- data:{'name':'iphone','num':0},add:function(){$scope.goods.data.num=Math.min(++$scope.goods.data.num,6)},reduce:function(){$scope.goods.data.num=Math.max(--$scope.goods.data.num,0)}
- }
- }])
- </script>
- </body>
- </html>
