Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to use ng-src

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 268
    Comment on it

    Hi all,

    Here is an example, to how to use ng-src. It is basically used to use a path or source in a tag. If we are not using the ng-src then we will get just a path on our page on.


    controller.Js

      var socialApp= angular.module('socialApp', []);
      socialApp.controller('SocailCtrl', function ($scope, $http){
        $http.get('social.json').success(function(data) {
          $scope.socials = data;
        });
      });
    

    HTML:-

     <body ng-controller="SocailCtrl">
        <table>
          <tr>
            <th>Title</th>
            <th>Icon</th>
          </tr>
          <tr ng-repeat="social in socials">
            <td>{{social.name}}</td>
            <td><img ng-src="{{social.IconURL}}" width="100"></td>
          </tr>
        </table>
      </body>
    

    Json :-

    [
      {
        "name": "facebook",
        "IconURL": "http://icons.iconarchive.com/icons/designbolts/social-stamps/256/Facebook-icon.png",
      },
      {
        "name": "Dribble",
        "IconURL": "http://icons.iconarchive.com/icons/designbolts/social-stamps/256/Dribbble-icon.png",
      }
    ]
    

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: