AngularJS 不起作用
[英]AngularJS doesn't work
問題描述
你們中有人能幫我理解為什么這些代碼不起作用嗎？ 雖然我是 AngularJS 的新手，但我想我遵循了所有說明。
簡單地說，我有 index.html 和 app.js，如下所示，但是當我打開 index.html 時，它什么也沒顯示（空白頁）。
(function(){ var app = angular.module("store",[]); app.contorller("StoreController", function($scope){ this.products = gems; }); var gems = [ { name: 'Dodecachedron1', price: 1.95, description: 'In geometry, a dodecahedron is any polyhedron with twelve flat faces. The most familiar dodecahedron is the regular dodecahedron, which is a Platonic solid', canPurchase: true }, { name: 'Dodecachedron2', price: 2.95, description: 'In geometry, a dodecahedron is any polyhedron with twelve flat faces. The most familiar dodecahedron is the regular dodecahedron, which is a Platonic solid', canPurchase: false } ]; })();
<!doctype html> <html ng-app='store'> <head> <title>Gem Online Store</title> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="bootstrap/bootstrap.min.css" /> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> <script type="text/javascript" src="app.js"></script> </head> <body class="well"" ng-controller='StoreController'> <div ng-repeat='product in StoreController.products'> <h1>{{product.name}}</h1> <em class="pull-right">${{product.price | currency}} </em> <p>{{product.description}}</p> <button ng-show='product.canPurchase'>Add to cart</button> </div> </body> </html>
1 個解決方案
解決方案1
0 2016-05-13 03:12:38
- 您需要將范圍設置為要使用的 products 變量
- 修復“well”中的雙引號
- app.controller 中的錯字
- 您不需要 StoreController 作為重復中的前綴
- 將您的 css 更新為 cdn
- 刪除額外的“$”，因為貨幣過濾器已經添加了它
- 這個演示我刪除了“app.js”作為依賴項，但你的代碼中需要它
(function() { var app = angular.module("store", []); app.controller("StoreController", function($scope) { $scope.products = gems; }); var gems = [{ name: 'Dodecachedron1', price: 1.95, description: 'In geometry, a dodecahedron is any polyhedron with twelve flat faces. The most familiar dodecahedron is the regular dodecahedron, which is a Platonic solid', canPurchase: true }, { name: 'Dodecachedron2', price: 2.95, description: 'In geometry, a dodecahedron is any polyhedron with twelve flat faces. The most familiar dodecahedron is the regular dodecahedron, which is a Platonic solid', canPurchase: false }]; })();
<!doctype html> <html ng-app="store"> <head> <title>Gem Online Store</title> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" /> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> <!--<script src="app.js"></script>--> </head> <body class="well"> <div ng-controller="StoreController"> <div ng-repeat="product in products"> <h1>{{product.name}}</h1> <em class="pull-right">{{product.price | currency}} </em> <p>{{product.description}}</p> <button ng-show="product.canPurchase">Add to cart</button> </div> </div> </body> </html>
$（this）在angularJS中不起作用
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.