Question

AngularJS相当新，所以我可能试图快速完成这一过程。

我正在尝试使用AngularJS将一个img，一个日期和一个字符串重复显示到div中，但无论我做什么，我都会继续显示相同的{{x.name}}而不是数组中的数据。

这是标题：

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Open+Sans" />
    <script type="text/javascript" src="myApp.js"></script>
    <script type="text/javascript" src="controller.js"></script>
    <script type="text/javascript" src="script.js"></script>
</head>

以下是我试图自动化的部分：

<section id="angular-section" ng-app="myApp">
    <h1>ANGULAR SECTION</h1>
    <div class="main" ng-controller="myCtrl">
        <div class="container">
            <div ng-repeat="x in employees">
                <div class="headshot"> <img src="{{ x.cover }}">
                    <p>{{ x.name }}</p>
                    <p>{{ x.strtdate | date }}</p>
                </div>
            </div>
        </div>
    </div>
</section>

这是controller.js的内容：

angular
.module('myApp',[])
.controller('myCtrl', ['$scope', function($scope){
            $scope.employees = [
                {
                    name: 'Jamie Bohanna',
                    strtdate: new Date('2014', '03', '08'), 
                    cover: 'img/JH.jpg',
                }
                , /* etc..... */
];
        });

这是myApp.js：

 var app = angular.module("myApp", []);

尝试访问controller.js或myApp.js时出现此错误：

Cannot GET /controller.js

Answer 1

已修改：已添加代码段

删除 controller.js 上的[]，因为当您放置angular.module("myApp", [])时，您已经在 myApp.js 上创建了应用注意这里的[]。

在 controller.js 上，您只需要输入以下内容即可找到该模块（因为它已经创建）：

angular
.module('myApp') //removed the [] since the app was already created on myApp.js
.controller('myCtrl', ['$scope', function($scope){
            $scope.employees = [
// rest of your controller...

此外，代码末尾缺少]

＆＃13;

angular
  .module('myApp', [])
  .controller('myCtrl', ['$scope',
      function($scope) {
        
        $scope.employees = [{
          name: 'Jamie Bohanna',
          strtdate: new Date('2014', '03', '08'),
          cover: 'img/JH.jpg',
        }];
        
      }]);//this ] was missing

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<section id="angular-section" ng-app="myApp">
  <h1>ANGULAR SECTION</h1>
  <div class="main" ng-controller="myCtrl">
    <div class="container">
      <div ng-repeat="x in employees">
        <div class="headshot">
          <img src="{{ x.cover }}">
          <p>{{ x.name }}</p>
          <p>{{ x.strtdate | date }}</p>
        </div>
      </div>
    </div>
  </div>
</section>

＆＃13;

AngularJS ng-repeat - 无法获取模块或控制器

1 个答案: