Ionic view not working. Angular problem


#1

Hi Guys, I am new to ionic and doing an online traning. I got stuck on this problem. Can you please help me?

My controller

.controller('ListController', ['$scope', '$http', function ($scope, $http) {
$http.get('js/data.json').success(function(data){
    $scope.artists = data;
});
}]);

my view

    <ion-content ng-controller="ListController" class="has-subheader">
    <ion-list>
        <ion-item ng-repeat='item in artists' class="item-thumbnail-left item-text-wrap">
            <img src="img/{{item.shortname}}_tn.jpg" alt="{{item.name }} Photo"/>

            <h2>{{item.name}}</h2>

            <h3>{{item.reknown}}</h3>

            <p>{{item.bio}}</p>
        </ion-item>

    </ion-list>
</ion-content>

But I can’t see the data in the data.json. Looks like it’s not recognizing the curly braces {{ }}

See chrome error

GET http://192.168.195.131:8100/img/%7B%7Bitem.shortname%7D%7D_tn.jpg 404 (Not Found)

#2

Do you have a CodePen showing your problem?


#3

Nevermind I found the problem

I changed $scope.artists = data;
to
" $scope.artists = data.artists;

And I use ng-src to load the image source on my html

Thanks