Javascript Can'；找不到angularJS libs_Javascript_Html_Angularjs

Javascript Can'；找不到angularJS libs

javascript html angularjs

Javascript Can'；找不到angularJS libs,javascript,html,angularjs,Javascript,Html,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.

我是前端开发和学习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>

当我在chrome上打开这个index.html页面时，我没有看到

angularJS

指令被实际值替换。我没有在任何服务器上托管此文件。根据我的理解，对于html，我可以将所有资源保持在相对路径中，并且

html

文件可以看到它们。那么为什么不在这里

angularJS

能够解决这个问题呢

这是我在chrome上打开时的

html

输出

您只是忘记了包含

ngApp

指令，如下所示：

angular.module('app', [])
...

<html ng-app="app">

angular.module（'app'，[]）
...

您只是忘记了包含

ngApp

指令，如下所示：

angular.module('app', [])
...

<html ng-app="app">

angular.module（'app'，[]）
...

您忘记了ng repeat：您访问了

store.product

，而您应该有一些包装器元素，如


{{product.name}
${{product.price}
添加到购物车

您忘记了ng repeat：您访问了

store.product

，而您应该有一些包装器元素，如


{{product.name}
${{product.price}
添加到购物车

不，没有任何区别。我已经更新了我的

index.html

，还发布了我的

app.js

文件来显示我现在拥有的东西。仍然是相同的输出。我甚至尝试了基本的

{{“test”}

输出，并期望在html上获得

测试作为输出，但它不起作用。除此之外，您的控制器外还有一个数组，您的对象中有一个额外的分号（soldOut:true；
），您还试图访问$scope.product
，但是您有一个名为$scope.products
的数组，那么您应该使用ngRepeat
对元素进行迭代。改变它，它应该会工作。不，它没有任何区别。我已经更新了我的index.html
，还发布了我的app.js
文件来显示我现在拥有的东西。仍然是相同的输出。我甚至尝试了基本的{{“test”}
输出，并期望在html上获得测试作为输出，但它不起作用。除此之外，您的控制器外还有一个数组，您的对象中有一个额外的分号（soldOut:true；
），您还试图访问$scope.product
，但是您有一个名为$scope.products
的数组，那么您应该使用ngRepeat对元素进行迭代。改变它，它就会起作用。
<!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 ng-repeat="product in products>
    <div class="product row" ng-hide="product.soldOut">
        <h3>
        {{product.name}}
        <em class="pull-right">$ {{product.price}}</em>
    </h3>
        <button ng-show="product.canPurchase">Add to cart</button>
    </div>
  </div>
</body>

</html>