Question

我是Angular的新手，现在有一个分裂的问题。

我想通过使用split（“ - ”和“;”）将类主题拆分为两个名为subject ID和Name的列。但是，我不知道如何在ng-repeat表中执行此操作。

这就是现在的表格：

我想要的是3列表更像这样：

username  subject ID  Subject Name

HTML CODE

<table class="table table-hover">
<thead>
    <tr>
        <th>#</th>
        <th>Username</th>
        <th>Class Subjects</th>
    </tr>
</thead>
<tbody>
    <tr ng-repeat="studentsMember in currentPageElements">
        <td>{{$index + 1}}</td>
        <td>{{studentsMember.username}}</td>
        <td>{{studentsMember.class_subject}}</td>
    </tr>
</tbody>

控制器

function listStudentClassCtrl($scope,UserManager,SchoolService,SingleRequestHandler,TableService) {
    $scope.items = {};

    var listStudentClassDefer;
    if(angular.isUndefined(listStudentClassDefer))
    {
      $scope.loading = true;
      listStudentClassDefer = SingleRequestHandler.promiseRequest('ListClassesBySchoolId', {inst_id: SchoolService.getCurrentSchool().institution_id, user_type: 10});
      listStudentClassDefer.promise.then(
        function(data){
            console.info("ListUsers - data ",data);
          $scope.staff = data.response;
          TableService.elements = $scope.staff;
        }, 
        function(httpError){
          console.log(httpError);
          $scope.alert.stat = true;
        })
        .finally(function(){
          $scope.loading = false;
        });
    }
}

数据回复格式

 "response":[  
   {  

      "username":"bingowere ",
      "class_subject":"8GEO 3 -- SocialSciences; 8SCI 3 -- Unknown; 8JAP 1 -- Unknown; 8PDH 4 -- Unknown"
   },
   {  
      "username":"letbingo ",
      "class_subject":"8GEO 2 -- SocialSciences; 8RC 6 -- SocialSciences; 8PDH 1 -- Unknown"
   }]

Answer 1

我相信这可能更接近于清徐所追求的目标。

HTML：

<body ng-controller="listStudentClassCtrl">
  <table class="table table-hover">
    <thead>
      <tr>
        <th>#</th>
        <th>Username</th>
        <th>Subject ID</th>
        <th>Subject Name</th>
      </tr>
    </thead>
    <tbody ng-repeat="studentsMember in currentPageElements">
      <tr ng-repeat="classSubject in studentsMember.class_subject.split(';')">
        <td>{{$index + 1}}</td>
        <td>{{studentsMember.username}}</td>
        <td ng-repeat="SubjectIDName in classSubject.split('--')">{{SubjectIDName}}</td>
      </tr>
    </tbody>
  </table>
</body>

JavaScript / AngularJS控制器：

app.controller('listStudentClassCtrl', function($scope) {
  $scope.currentPageElements = [{
    "username": "bingowere ",
    "class_subject": "8GEO 3 -- SocialSciences; 8SCI 3 -- Unknown; 8JAP 1 -- Unknown; 8PDH 4 -- Unknown"
  }, {
    "username": "letbingo ",
    "class_subject": "8GEO 2 -- SocialSciences; 8RC 6 -- SocialSciences; 8PDH 1 -- Unknown"
  }];
});

以下是工作的Plunker http://plnkr.co/edit/zcDHa6W8hRUKNMOgKnYZ?p=preview

的链接

如何在ng-repeat中拆分数组列表

1 个答案: