0
私はフロントエンドの開発とangularJSの学習には新しくありません。私はここにフォルダ構造angularJSライブラリが見つかりません
.
├── angular.min.js
├── app.js
├── bootstrap.min.css
└── index.html
を以下としていることは「私のindex.html
<!DOCTYPE html>
<html ng-app="gemStore">
<head>
<link rel="stylesheet" type="text/css" href="bootstrap.min.css" />
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="app.js"></script>
</head>
<body ng-controller="StoreController as store">
<div class="product row" ng-hide="store.product.soldOut">
<h3>
{{store.product.name}}
<em class="pull-right">${{store.product.price}}</em>
</h3>
<button ng-show="store.product.canPurchase">Add to cart</button>
</div>
</body>
</html>
で、私のapp.jsファイルは、私はクロームでこのindex.htmlページを開くと
(function(){
var app = angular.module('gemStore', []);
app.controller('StoreController', function(){
this.products = gem;
});
var gem = [{
name: 'Azurite',
price: 2.95,
canPurchase: false,
soldOut: true;
}, {
name: 'Azurite 2',
price: 2.95,
canPurchase: false,
soldOut: true,
}]
})();
、私はドンであります実際の値に置換されたangularJSの指示を参照してください。私はこのファイルをどのサーバーでもホストしていません。私の理解によれば、htmlでは、すべてのリソースを相対パスに保ち、htmlファイルがそれらを見ることができます。なぜここにいないのですかangularJSは解決できますか？あなたはNGリピートを忘れてしまった
angular.module('app', [])
...
<html ng-app="app">
いや、それはどんな違いがありませんでした。私は 'index.html'を更新して、' app.js'ファイルを投稿して、今持っているものを表示しています。それでも同じ出力。 –
私は基本的な '{{" test "}}'出力を試して、htmlの出力として 'test'を得ることも期待されていましたが、うまくいきませんでした。 –
あなたのコントローラの外側に配列**がありますが、あなたのオブジェクトにセミコロン（ ';'）が余分にあり（ 'soldOut：true;'）、あなたは '$ scope.product'にアクセスしようとしています。 '$ scope.products'という配列を持っているなら、' ngRepeat'を使って要素を反復処理する必要があります。それを変更し、それは動作するはずです。 – developer033