Использование ng-repeat для получения имен столбцов таблицы

Question

Использование ng-repeat для получения имен столбцов таблицы

0

Я пытаюсь создать таблицу, используя angularjs. Код выглядит следующим образом

Код:

 <table>
     <thead>
         <tr>
             <th>Column Name1</th>
             <th>Column Name2</th>
         </tr>
     </thead>

     <tbody>
         <tr ng-repeat="item in Items">
             <th>{{Items[$index].Age}}</th>
             <th>{{Items[$index].School}}</th>
         </tr>
     </tbody>
 </table>

Здесь то, что я хочу сделать, это то, что, когда в таблице генерируются данные о возрасте и школе, они должны находиться под именем человека, и это имя должно появляться в столбце. Как я могу это сделать?

Если у меня есть массив $ scope следующим образом;

$scope.Items = [{Name:Jhon,Age:23, School: 'some school'}....];

Я хочу, чтобы имя colum было Jhon и ниже, что я хочу, чтобы другие 2 данные

Tharindu Senanayake 31 май 2016, в 11:05

Источник

Теги:

angularjs

angularjs-ng-repeat

2 ответа

Ещё вопросы

Shashank · Answer 1 · 2016-05-31T08-11-00.000Z

Посмотрите на фрагмент ниже, который иллюстрирует, как достичь возраста и школы под именем:

<tr ng-repeat="item in Items">
        <td>
          <table>
            <thead>
              <tr>
                <th colspan="2">{{item.Name}}</th>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td align="center"><i>Age:</i> {{item.Age}}</td>
                <td align="center"><i>School:</i> {{item.School}}</td>
              </tr>
            </tbody>
          </table>
        </td>
      </tr>

Смотрите демо здесь.

macrog · Answer 2 · 2016-05-31T07-54-00.000Z

Вы повторяете массив элементов, где каждый объект (в вашем случае "item") имеет свойство Age и School, например:

var Items = [{Age:23, School: 'some school'}....];

эта часть неверна:

<tbody>
   <tr ng-repeat="item in Items">
      <th>
         {{Items[$index].Age}}
      </th>
      <th>
         {{Items[$index].School}}
      </th>
</tbody>

должен быть:

<tbody>
   <tr ng-repeat="item in Items">
      <th>
         {{item.Age}}
      </th>
      <th>
         {{item.School}}
      </th>
</tbody>

Моя проблема не с повторяющимися данными в столбцах. Я хочу, чтобы имена людей, которые имеют возраст и школу в качестве атрибутов в столбцах. Позвольте мне отредактировать вопрос так, чтобы он был ясен