Bind Json Данные HTML TABLE

Я новичок углового программированияBind Json Данные HTML TABLE

я хочу связать данные JSON, которые я получаю от веб-сервиса на HTML таблицы,

Вот мой код:

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <title>LIST OF USER Sample</title> 
 
    <script src="../Scripts/angular.min.js"></script> 
 
    <script src="../Scripts/module.js"></script> 
 
    <script> 
 

 
     function PeopleCtrl($scope, $http) { 
 

 
      $scope.people = []; 
 

 
      $scope.loadPeople = function() { 
 

 
       var httpRequest = $http 
 
        ({ 
 
         method: 'GET', 
 
         url: 'http://10.17.44.236:9090/MobileBootcamp.svc/getalluseravailability' 
 

 
        }) 
 
        .success(function (data, status) { 
 
         debugger; 
 
         $scope.people = data; 
 

 
        }); 
 

 

 
      }; 
 
      $scope.loadPeople(); 
 
     } 
 

 
    </script> 
 
</head> 
 
<body> 
 
    <div ng-app="app"> 
 
     <div ng-controller="PeopleCtrl" ng-init="loadPeople()"> 
 
      <table> 
 
       <tr> 
 
        <th>Id</th> 
 
        <th>Availibility</th> 
 
       </tr> 
 
       <tr ng-repeat="x in people.Datalist[0]"> 
 
        <td>{{x.UserID}}</td> 
 
        <td>{{x.Availability}}</td> 
 
       </tr> 
 
       <tr> 
 
        <td>{{people.DataList[0].UserID}}</td> 
 
        <td>{{people.DataList[0].Availability}}</td> 
 
       </tr> 
 
       <tr> 
 
        <td>{{people.DataList[1].UserID}}</td> 
 
        <td>{{people.DataList[1].Availability}}</td> 
 
       </tr> 
 

 
      </table> 
 
     </div> 
 
    </div> 
 

 

 
    <script src="cordova.js"></script> 
 
    <script src="js/platformOverrides.js"></script> 
 
    <script src="js/index.js"></script> 
 
</body> 
 
</html>

и это JSON из веб-службы

{"Status":true,"Message":"","Data":null,"DataList":[{"ChangeBy":"Admin","ChangeDate":"\/Date(1439437580137+0700)\/","ChangeNo":2,"CreateBy":"Admin","CreateDate":"\/Date(1439437580137+0700)\/","Availability":true,"LastCheckIn":"\/Date(1439437645420+0700)\/","UserID":"Admin"},{"ChangeBy":"ITK_ABD","ChangeDate":"\/Date(1439398800000+0700)\/","ChangeNo":1,"CreateBy":"ITK_ABD","CreateDate":"\/Date(1439398800000+0700)\/","Availability":false,"LastCheckIn":"\/Date(1439398800000+0700)\/","UserID":"ITK_ABD"}]}

я уже попробовать "нг-повтора", но это не работало,

данные как Data -> DataList -> [0] -> идента, доступность и т.д ...

ТНХ заранее

источник

2015-08-13 Borom1r

<тр ng-repeat = "x в people.Datalist [0]"> это должно быть –

- ваш HTTP-запрос жизнеспособен? Я последовал за ним и не стал доступен –

Нет необходимости в [0]. мы не хотим прокручивать ваш первый объект, так что только people.DataList выполнит эту работу. Он будет проходить через все объекты внутри этого массива.

  <tr ng-repeat="x in people.DataList"> 
       <td>{{x.UserID}}</td> 
       <td>{{x.Availability}}</td> 
      </tr>

источник

2015-08-13 10:07:28

Вам не нужен [0]. Ваш ng-repeat здесь, чтобы получить все элементы списка. Вам просто нужно предоставить свой список, а не индекс и угловой сделайте эту работу.

<tr ng-repeat="x in people.DataList">

источник

2015-08-13 10:07:42

Ошибка Typo. его people.DataList не people.Datalist –

@MohanSingh Rigth, спасибо. –

эй его работа, спасибо! – Borom1r

Вы пытаетесь повторить объект здесь:

<tr ng-repeat="x in people.Datalist[0]">

Вы можете повторить только от типа массива данных. Таким образом, вы должны сделать это так:

<tr ng-repeat="x in people.Datalist">

источник

2015-08-13 10:09:15 Likeee

проделайте следующее -

<tr ng-repeat="x in people.Datalist"> 
    <td>{{x.UserID}}</td> 
    <td>{{x.Availability}}</td> 
</tr>

, как у вас есть массив объектов в DataList, вы должны перебирать DataList вместо DataList [0]

источник

2015-08-13 10:10:22

Bind Json Данные HTML TABLE

ответ

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