как передать данные объекта в таблицу с помощью ng-repeat

У меня есть этот объект с именем «SEG-Data» следующим образом. Я пытаюсь поместить эти данные в таблицу, используя ng-repeat.как передать данные объекта в таблицу с помощью ng-repeat

SEG_Data 
    Object {ImportValues: Array[2]} 
    ImportValues: Array[2] 
     0: Object 
       ImportArray: "0045614" 
       Name: "dean" 
       Type: "xyz" 
     1: Object 
       ImportArray: "2567741" 
       Name: "dean" 
       Type: "abc" 
     length: 2

таблица используется, как показано ниже, и я использую нг-повтор, где я mentiond «поле SEG_data.ImportValues», чтобы получить значение .... Но как-то я не получаю данные на пользовательском интерфейсе.

<table style="width:100%" border:"1px"> 
       <tr> 
        <th>ImportArray</th> 
        <th>Name</th> 
        <th>Type</th> 
       </tr> 
       <tr ng-repeat="field in SEG_Data.ImportValues"> 
        <td>{{field.ImportArray}}</td> 
        <td>{{field.Name}}</td> 
        <td>{{field.Type}}</td> 
       </tr> 

      </table>

Любой совет, если я делаю это неправильно для отображения ??

источник

2016-11-15 Adu Rao

Из вашего примера, я ожидаю, что таблица имеет 2 строки данных. Вы говорите, что количество строк данных в таблице не соответствует вашему json? Также есть переменная вида SEG_data? –

Это «SEG_Data», и вы использовали «SEG_data» в ng-repeat. Переменные JavaScript чувствительны к регистру. Просто исправьте орфографию, она должна работать. – superUser

Я не вижу никаких данных в пользовательском интерфейсе. –

Ваш объект называется SEG_Data, но вы ссылаетесь на SEG_data с нижним регистром 'd' в своем шаблоне. Данные отображаются правильно с этим одним изменением.

Объект

$scope.SEG_Data = { 
    ImportValues: [{ 
     ImportArray: "0045614", 
     Name: "dean", 
     Type: "xyz" 
    }, { 
     ImportArray: "2567741", 
     Name: "dean", 
     Type: "abc" 
    }] 
};

Шаблон

<table style="width:100%; border:1px"> 
    <tr> 
     <th>ImportArray</th> 
     <th>Name</th> 
     <th>Type</th> 
    </tr> 
    <tr ng-repeat="field in SEG_Data.ImportValues"> 
     <td>{{field.ImportArray}}</td> 
     <td>{{field.Name}}</td> 
     <td>{{field.Type}}</td> 
    </tr> 
</table>

See plunker example

источник

2016-11-15 19:04:39 shanzilla

tat был опечаткой, пока я опубликовал здесь. исправил эту опечатку в вопросе –

Я добавил пример plunker; код работает отлично, если вы заглавные буквы D. Если не проблема может быть с вашим объектом - где он определен и когда он загружен? – shanzilla

Рабочий пример:

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

 
function MyCtrl($scope) { 
 
    $scope.SEG_Data = { 
 
    ImportValues: [{ 
 
     ImportArray: "0045614", 
 
     Name: "dean", 
 
     Type: "xyz" 
 
    }, { 
 
     ImportArray: "2567741", 
 
     Name: "dean", 
 
     Type: "abc" 
 
    }] 
 
}; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <table> 
 
     <tr> 
 
      <th>ImportArray</th> 
 
      <th>Name</th> 
 
      <th>Type</th> 
 
     </tr> 
 
     <tr ng-repeat="field in SEG_Data.ImportValues"> 
 
      <td>{{field.ImportArray}}</td> 
 
      <td>{{field.Name}}</td> 
 
      <td>{{field.Type}}</td> 
 
     </tr> 
 
    </table> 
 
</div>

источник

2016-11-16 10:35:15

как передать данные объекта в таблицу с помощью ng-repeat

ответ

Смежные вопросы