无法加载资源

Unable to load resource

本文关键字：资源 加载      更新时间：2023-09-26

我只是刚接触angularjs。我正在尝试在我的索引中测试简单的控制器.html。但是当我在本地主机上运行它时，我收到一个错误：

无法加载资源：服务器以状态 404（未找到）响应。

这是我的文件夹结构：

angulartesting
-bower_components
-index.html
-script.js

这是我的索引.html文件：

<!-- index.html -->
<!DOCTYPE html>
<html  ng-app="store">
<head>
  <!-- SCROLLS -->
  <!-- load bootstrap and fontawesome via CDN -->
 <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel='stylesheet' type='text/css' />
  <!-- SPELLS -->
  <!-- load angular and angular route via CDN -->
  <script src="/bower_components/angular/angular.min.js"></script>
      <script src="/bower_components/angular-route/angular-route.js"></script>
  <script src="script.js"></script>
</head>
<body >
  <div ng-controller="StoreController as store">
    <h1>{{store.product.name}}</h1>
    <h2>${{store.product.price}}</h2>
  </div>
     <script src="bower_components/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>

这是我的脚本.js：

// create the module and name it scotchApp
    // also include ngRoute for all our routing needs
(function(){
     var app = angular.module('store', []);
     app.controller('StoreController',function(){
        this.product=gem;
     });
     var gem = {
        name:'Gaurav',
        price:'220'
     }
})();

谁能告诉我我做错了什么？
我正在本地服务器上运行它。

试试这个。我刚刚删除了脚本源之前的正斜杠并添加了ng-app属性。

    <!-- index.html -->
    <!DOCTYPE html>
    <html  ng-app="myApp">
    <head>
      <!-- SCROLLS -->
      <!-- load bootstrap and fontawesome via CDN -->
     <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel='stylesheet' type='text/css' />
      <!-- SPELLS -->
      <!-- **Removed forward slashes before script sources** -->
      <script src="bower_components/angular/angular.min.js"></script>
      <script src="bower_components/angular-route/angular-route.js"></script>
      <script src="script.js"></script>
    </head>
    <body>
      <div ng-controller="StoreController as store">
        <h1>{{store.product.name}}</h1>
        <h2>${{store.product.price}}</h2>
      </div>
         <script src="bower_components/bootstrap/js/bootstrap.min.js"></script>
    </body>
    </html>

希望对你有帮助

相关文章：