1

I'm getting really frustrated and I know it must be a simple mistake I'm making. So, I'm trying to get some images from my account on Behance and display them on my own site. I'm using AngularJS. With the following code I'm able to get a response:

'use strict';

angular.module('angularApp')
  .controller('BehanceCtrl', function ($scope, $resource) {

    $scope.behance = $resource('http://www.behance.net/v2/users/zachjanice/projects?client_id=xxxxxxxxxx', 
        { q:'', callback: 'JSON_CALLBACK'},
        {get:{method:'JSONP'}}
    );

    $scope.behanceResult = $scope.behance.get();

  });

In Chrome developer tools shows I'm getting a response.

angular.callbacks._0({"projects":[{"id":123456, etc. etc.}] })

My HTML file is showing:

<section ng-controller="BehanceCtrl">
    <div class="container">
        <div class="row">
            <ul>
                <li ng-repeat="behance in behanceResult.results">
                    <img ng-src="{{projects.covers}}">
                    <h1>{{projects.id.name}}</h1>
                </li>
            </ul>
        </div>
    </div>
</section>

What am I leaving out? And how can I display the images and headings for those images.

Any help is appreciated.

zach57
  • 442
  • 4
  • 20

2 Answers2

1
<section ng-controller="BehanceCtrl">
<div class="container">
    <div class="row">
        <ul>
            <li ng-repeat="behance in behanceResult.results">
                <img ng-src="{{behance.projects.covers}}">
                <h1>{{behance.projects.id.name}}</h1>
            </li>
        </ul>
    </div>
</div>

Issam Zoli
  • 2,724
  • 1
  • 21
  • 35
  • Appreciate the help, but I'm still not seeing the images populate. However, I know see that when I make the request I'm getting an error in the developer tools "Provisional headers are shown." I am working locally, should this effect my ability to see the images and information? – zach57 Apr 16 '14 at 20:24
0

The array you should use is behanceResult.projects, so this should work:

<div class="container">
<div class="row">
    <ul>
        <li ng-repeat="project in behanceResult.projects">
            <img ng-src="{{project.covers[202]}}">
            <h1>{{project.name}}</h1>
        </li>
    </ul>
</div>

Plá
  • 1
  • 1