ng-repeat 루프 내에서 특정 데이터 검색 angularjs

user1937021

ng-repeat 루프 내에서 JSON 파일 내의 특정 데이터를 검색하고 싶습니다. 내 코드는 지금까지 다음과 같으며 이미지의 올바른 저해상도 URL을 올바르게 가져 오도록 작동합니다. <p>태그 에서 특정 사용자의이 이미지에 해당하는 첫 번째 주석을 표시하고 싶습니다. 즉, 항상 사용자 이름 "tellasaur"의 첫 번째 "텍스트"값을 원합니다. 어떻게 가져와야할지 모르겠습니다. 도와 드릴까요? 감사!

NG- 반복 루프

 <li ng-repeat="p in pics">
                        <a href="{{p.link}}" target="_blank"><img ng-src="{{p.images.low_resolution.url}}" /></a>
 <p></p>
                    </li>

제어 장치

 app.controller('ShowImages', function($scope, InstagramAPI){
    $scope.layout = 'grid';
    $scope.data = {};
    $scope.pics = [];

    InstagramAPI.fetchPhotos(function(data){
      $scope.pics = data;
      console.log(data)
    });
  });

JSON

 "images":{
            "low_resolution":{
               "url":"https:\/\/scontent.cdninstagram.com\/hphotos-xaf1\/t51.2885-15\/s320x320\/e15\/11243658_841091872640638_1858051687_n.jpg",
               "width":320,
               "height":320
            },

         },
 "comments":{
            "count":38,
            "data":[
               {
                  "created_time":"1436314585",
                  "text":"Living on a lake @amarie4107",
                  "from":{
                     "username":"tellasaur",
                     "profile_picture":"https:\/\/igcdn-photos-b-a.akamaihd.net\/hphotos-ak-xfp1\/t51.2885-19\/11142181_1606991566225969_1204610350_a.jpg",
                     "id":"174270894",
                     "full_name":"kristella"
                  },
                  "id":"1024203434844916571"
               },
               {
                  "created_time":"1436317671",
                  "text":"Wow",
                  "from":{
                     "username":"sbcarol2002",
                     "profile_picture":"https:\/\/igcdn-photos-b-a.akamaihd.net\/hphotos-ak-xfp1\/t51.2885-19\/10707061_359756607505353_826681437_a.jpg",
                     "id":"1280059782",
                     "full_name":"Susan Long"
                  },
                  "id":"1024229322726738700"
               },
               {
                  "created_time":"1436320519",
                  "text":"\ud83d\udc93 dreamyy",
                  "from":{
                     "username":"veekster",
                     "profile_picture":"https:\/\/igcdn-photos-h-a.akamaihd.net\/hphotos-ak-xtf1\/t51.2885-19\/11117059_1743047859255223_204225114_a.jpg",
                     "id":"31179150",
                     "full_name":"Victoria Wright"
                  },
                  "id":"1024253210688915485"
               }

            ]
         }
Shaunhusain

다음은 필터를 사용하여 수행하는 한 가지 방법입니다.

angular.module('app',[])
.filter('getFirstCommentFrom',function(){
  return function(arr, user){
    for(var i=0;i<arr.length;i++)
    {
      if(arr[i].from.username==user)
        return arr[i].text;
    }
    return '';
  }
})
.controller('TestCtrl', function($scope){
  $scope.pics = [
    { "images":{
            "low_resolution":{
               "url":"https:\/\/scontent.cdninstagram.com\/hphotos-xaf1\/t51.2885-15\/s320x320\/e15\/11243658_841091872640638_1858051687_n.jpg",
               "width":320,
               "height":320
            },

         },
 "comments":{
            "count":38,
            "data":[
               {
                  "created_time":"1436314585",
                  "text":"Living on a lake @amarie4107",
                  "from":{
                     "username":"tellasaur",
                     "profile_picture":"https:\/\/igcdn-photos-b-a.akamaihd.net\/hphotos-ak-xfp1\/t51.2885-19\/11142181_1606991566225969_1204610350_a.jpg",
                     "id":"174270894",
                     "full_name":"kristella"
                  },
                  "id":"1024203434844916571"
               },
               {
                  "created_time":"1436317671",
                  "text":"Wow",
                  "from":{
                     "username":"sbcarol2002",
                     "profile_picture":"https:\/\/igcdn-photos-b-a.akamaihd.net\/hphotos-ak-xfp1\/t51.2885-19\/10707061_359756607505353_826681437_a.jpg",
                     "id":"1280059782",
                     "full_name":"Susan Long"
                  },
                  "id":"1024229322726738700"
               },
               {
                  "created_time":"1436320519",
                  "text":"\ud83d\udc93 dreamyy",
                  "from":{
                     "username":"veekster",
                     "profile_picture":"https:\/\/igcdn-photos-h-a.akamaihd.net\/hphotos-ak-xtf1\/t51.2885-19\/11117059_1743047859255223_204225114_a.jpg",
                     "id":"31179150",
                     "full_name":"Victoria Wright"
                  },
                  "id":"1024253210688915485"
               }

            ]
         }
     }
  ]
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<div ng-app="app" ng-controller="TestCtrl">
  <li ng-repeat="p in pics">
    <a href="{{p.link}}" target="_blank"><img ng-src="{{p.images.low_resolution.url}}" /></a>
    {{p.comments.data|getFirstCommentFrom:'tellasaur'}}
  <p></p>
  </li>
</div>

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

ng-repeat로 angularJS 루프

분류에서Dev

angularjs를 사용하여 특정 두 필드로 ng-repeat 검색?

분류에서Dev

angularjs에서 ng-repeat를 사용하는 동안 특정 항목 내부의 데이터를 표시하는 방법은 무엇입니까?

분류에서Dev

AngularJS : ng-repeat의 첫 번째 자식에만 검색 필터 적용

분류에서Dev

Angularjs는 ng-repeat에서 값을 검색합니다.

분류에서Dev

AngularJS의 ng-repeat 지시문 내부에 사용자 지정 필터를 사용하여 데이터 주문

분류에서Dev

angularJS 및 PHP로 ng-repeat의 특정 값 업데이트

분류에서Dev

AngularJS ng-repeat에서 2 개 배열의 데이터 사용

분류에서Dev

특정 ng-repeat에 필터 추가

분류에서Dev

값에 특수 문자 ":"가있는 Angularjs ng-repeat 정렬 테이블

분류에서Dev

Pandas 데이터 프레임의 특정 행에서 정보 검색

분류에서Dev

Pandas 데이터 프레임의 특정 행에서 정보 검색

분류에서Dev

웹 사이트에서 ng-repeat로 angularjs 배열을 검색하려면 어떻게해야합니까?

분류에서Dev

ng-repeat 이상한 문제가있는 Angularjs for 루프

분류에서Dev

AngularJS ng-repeat에서 "사용자 지정 값"필터링

분류에서Dev

Pandas-전체 데이터 프레임에서 특정 텍스트 검색

분류에서Dev

ng-repeat AngularJS에서 요소 지정

분류에서Dev

AngularJs-ng -repeat에 데이터가 표시되지 않음

분류에서Dev

특정 데이터베이스에서 데이터 검색

분류에서Dev

AngularJS의 ng-repeat 내에서 카운터 증가

분류에서Dev

AngularJS : 동적 데이터로 ng-repeat

분류에서Dev

AngularJS-ng-repeat의 특정 항목에 대한 ng-href 비활성화

분류에서Dev

특정 필드 만 검색하는 각도 ng-repeat

분류에서Dev

데이터베이스에서 데이터를 가져와 AngularJS의 ng-repeat에서 사용

분류에서Dev

angularjs의 ng-repeat에서 동일한 데이터로 HTML 요소 숨기기

분류에서Dev

ng-repeat 테이블의 특정 행에 대한 ng-switch

분류에서Dev

ng-repeat $ scope 외부에서 업데이트가 정의되지 않은 경우 ng-repeat의 AngularJS ng-model $ scope가 정의되지 않았습니다.

분류에서Dev

특정 데이터 만 정렬하기위한 ng-repeat의 사용자 정의 순서

분류에서Dev

DB에서 특정 데이터를 검색하여보기로 보내기

Related 관련 기사

  1. 1

    ng-repeat로 angularJS 루프

  2. 2

    angularjs를 사용하여 특정 두 필드로 ng-repeat 검색?

  3. 3

    angularjs에서 ng-repeat를 사용하는 동안 특정 항목 내부의 데이터를 표시하는 방법은 무엇입니까?

  4. 4

    AngularJS : ng-repeat의 첫 번째 자식에만 검색 필터 적용

  5. 5

    Angularjs는 ng-repeat에서 값을 검색합니다.

  6. 6

    AngularJS의 ng-repeat 지시문 내부에 사용자 지정 필터를 사용하여 데이터 주문

  7. 7

    angularJS 및 PHP로 ng-repeat의 특정 값 업데이트

  8. 8

    AngularJS ng-repeat에서 2 개 배열의 데이터 사용

  9. 9

    특정 ng-repeat에 필터 추가

  10. 10

    값에 특수 문자 ":"가있는 Angularjs ng-repeat 정렬 테이블

  11. 11

    Pandas 데이터 프레임의 특정 행에서 정보 검색

  12. 12

    Pandas 데이터 프레임의 특정 행에서 정보 검색

  13. 13

    웹 사이트에서 ng-repeat로 angularjs 배열을 검색하려면 어떻게해야합니까?

  14. 14

    ng-repeat 이상한 문제가있는 Angularjs for 루프

  15. 15

    AngularJS ng-repeat에서 "사용자 지정 값"필터링

  16. 16

    Pandas-전체 데이터 프레임에서 특정 텍스트 검색

  17. 17

    ng-repeat AngularJS에서 요소 지정

  18. 18

    AngularJs-ng -repeat에 데이터가 표시되지 않음

  19. 19

    특정 데이터베이스에서 데이터 검색

  20. 20

    AngularJS의 ng-repeat 내에서 카운터 증가

  21. 21

    AngularJS : 동적 데이터로 ng-repeat

  22. 22

    AngularJS-ng-repeat의 특정 항목에 대한 ng-href 비활성화

  23. 23

    특정 필드 만 검색하는 각도 ng-repeat

  24. 24

    데이터베이스에서 데이터를 가져와 AngularJS의 ng-repeat에서 사용

  25. 25

    angularjs의 ng-repeat에서 동일한 데이터로 HTML 요소 숨기기

  26. 26

    ng-repeat 테이블의 특정 행에 대한 ng-switch

  27. 27

    ng-repeat $ scope 외부에서 업데이트가 정의되지 않은 경우 ng-repeat의 AngularJS ng-model $ scope가 정의되지 않았습니다.

  28. 28

    특정 데이터 만 정렬하기위한 ng-repeat의 사용자 정의 순서

  29. 29

    DB에서 특정 데이터를 검색하여보기로 보내기

뜨겁다태그

보관