我试图在地址和日期下添加会话详细信息。但是ng-repeat正在工作,但它没有给我任何错误。任何人都可以检查我的代码,并让我知道丢失了什么。

..... app.js .....

“使用严格”;

var eventsApp = angular.module('eventsApp',[]);



'use strict';


eventsApp.controller('EventController',

    function EventController($scope){
   $scope.event = {
       name: 'Angular Event App',
       date: '04/02/2017',
       time: '3.09 am',
       location: {
           address: 'Google Headquaters',
           city: 'Mountain View',
           Province: 'CA'
       },
       imageUrl: '/img/angularjs-logo.png',
       sessions: [
           {
               name: 'Directive Masterclass'
           },
           {
               name: 'Scope for fun and profit'
           },
           {
               name: 'well Behaved Controllers'
           }
       ]
   };
});

    <!DOCTYPE html>
    <html lang="en" ng-app="eventsApp">

    <head>
        <meta charset="utf-8">
        <title>Event Registration</title>
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="css/app.css">
        <script src="lib/jquery.min.js"></script>
        <script src="lib/underscore-1.4.4.min.js"></script>
        <script src="lib/bootstrap.min.js"></script>
        <script src="lib/angular/angular.js"></script>
        <script src="js/app.js"></script>
        <script src="js/controllers/EventController.js"></script>

    </head>

    <body>
        <div class="container">
            <div class="navbar-inner">
                <ul class="nav">


                </ul>

            </div>
            <div ng-controller="EventController" style="padding-left:20px; padding-right:20px">
                <img ng-src="{{event.imageUrl}}" alt="{{event.name}}" />
                <div class="row">
                    <div class="span1">
                        <h2> {{event.name}}</h2>
                    </div>

                </div>
                <div class="row">
                    <div class="span2">
                        <div><strong>Date: </strong> {{event.date}}</div>
                        <div><strong>Time: </strong> {{event.time}}</div>
                    </div>
                    <div class="span3">
                        <address>
                    <strong> Address: </strong><br>
                        {{event.location.address}}<br>
                        {{event.location.city}}, {{event.location.province}}
                    </address>
                    </div>
                </div>



                <h3>Sessions</h3>
                <ul class="thumbnails">
                    <li ng-repeat="session in event.sessions" ></li>
                    <div class="row session">
                    <div class="well span9">
                        <h4 class="well-title">{{session.name}}</h4>
                        </div>
                    </div>

                </ul>
            </div>

        </div>

    </body>

    </html>





javascript - AngularJS ng-repeat指令不适用于我的EventController.js-LMLPHP

最佳答案

您需要在li标记内添加div内容

改变这个

<li ng-repeat="session in event.sessions" ></li>
        <div class="row session">
         <div class="well span9">
            <h4 class="well-title">{{session.name}}</h4>
        </div>
 </div>


对此

<li ng-repeat="session in event.sessions">
      <div class="row session">
            <div class="well span9">
         <h4 class="well-title">{{session.name}}</h4>
      </div>
   </div>
</li>


Demo

关于javascript - AngularJS ng-repeat指令不适用于我的EventController.js,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/43175722/

10-12 14:06
查看更多