javascript - div 中的 ng-repeat 不起作用

标签 javascript html angularjs

我已经从后端收到了 active_content,并且从 console.log 确认,响应作为数组很好。但是,这里的 ng-repeat 似乎不起作用。我试图在类似图 block 的设计中显示类详细信息,以便每个类都有自己的图 block 以及各自的详细信息。

HTML

<div class="row">
  <div ng-repeat="content in active_content" class="col-md-3">
     <div class="info-tile">
        <div class="tile-heading" style="font-size:30px"><span>{{content.class}}-{{content.division}}</span><span ng-if="content.stream"> | {{content.stream}} </span></div>
        <div style="font-size:20px;text-align:right;"><span>{{content.studentCount}} students</span></div>
        <div style="font-size:20px;text-align:right;padding-bottom:7%;"><span>5 absentees</span></div>
        <div class="tile-footer" style="font-size:13px;"><a  href="#" class="text-danger" ><span ng-show="content.classTeacherGender= 'M'">Mr.</span><span ng-show="content.classTeacherGender == 'F' ">Mrs.</span> {{content.classTeacherfName + " " + content.classTeacherlName}}</a></div>
     </div>
  </div>    

AngularJS

var co_data = {};

   co_data.token = $cookies.get("myToken");



           $http({
             method  : 'POST',
             url     : 'Here goes my php service ',
             data    : co_data,
             headers : {'Content-Type': 'application/x-www-form-urlencoded'}
            })
            .then(function(response) {
            console.log(response);
         if(response.data.status){

               $scope.isContentFound = true;             
               $scope.active_content = response.data.response;
               console.log("Active Content", $scope.active_content);

          }

           else{ 
              $scope.isContentFound = false;      
              $scope.active_content = {};
           }
              }); 
          }
        $scope.fetchContent();

Chrome 控制台

Active Content 
(7) [{…}, {…}, {…}, {…}, {…}, {…}, {…}]
0
:
{class: "01", division: "A", classTeacherfName: "Abhijith", classTeacherlName: "C S", classTeacherGender: "M", …}
1
:
{class: "02", division: "A", classTeacherfName: "FAVAZ", classTeacherlName: "M", classTeacherGender: "M", …}
2
:
{class: "04", division: "A", classTeacherfName: "RITHWICK", classTeacherlName: "ANIL", classTeacherGender: "M", …}
3
:
{class: "05", division: "A", classTeacherfName: "MANJU", classTeacherlName: "ANIL", classTeacherGender: "M", …}
4
:
{class: "11", division: "B", classTeacherfName: "Anas", classTeacherlName: "Jafry", classTeacherGender: "M", …}
5
:
{class: "12", division: "A", classTeacherfName: "SHAHIL", classTeacherlName: "NUHMAN", classTeacherGender: "M", …}
6
:
{class: "10", division: "C", classTeacherfName: "SAIRAB", classTeacherlName: "RAHMAN", classTeacherGender: "M", …}

最佳答案

在你的 ng-repeat 中写下这个..

ng-repeat="content in active_content track by $index"

或者,

ng-repeat="content in active_content track by content.class"

关于javascript - div 中的 ng-repeat 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47549554/

相关文章:

javascript - cloneNode 与 innerHTML

javascript - 关注表单中的所有元素

javascript - 使用 angle-input-modified 检索索引?

javascript - 使用 Canvas 和 ForEach 处理异步调用

javascript - 随机大小的 SVG 图案单元

javascript - 如何在 vuetify vue.js 应用程序中分离 <v-navigation-drawer> ?

javascript - 如何从 `currencyId` 数组中的其余项目中 fork `currencyCode` 和 `control`

javascript - 如何让按钮对应于不同的下拉 div?

angularjs - Videogular - 如何在 div ng-click 上播放给定的视频文件?

javascript - 强制重新触发 ajaxed 内容上的所有(脚本/函数)