如何从json对象加载图像并以角度ui网格显示它

时间:2016-08-09 09:31:20

标签: javascript angularjs

这里我加载了对象'结果'我想将徽标字段显示为图像而不是其名称,我该如何动态地执行此操作,我已将其静态完成,如图所示

angular.module('myApp').controller('homecon', function ($scope, $http, $location, $rootScope) {


$http.get("http://localhost:1488/api/CompanyApi/get").success(function (res) {
    $rootScope.result = res;

    });



    $scope.myGrid = {


        data: 'result',



        columnDefs: [{ field: "Comp_Name", displayName: 'Cmpany' },
            { field: 'email', displayName: 'Email' },
              { field: 'logo', cellTemplate: "<img width=\"50px\" ng-src='/logos/{{result[1].logo}}' lazy-src>" }
        ]

    };

output for code display one image i want to display all images related with its object

1 个答案:

答案 0 :(得分:0)

我不知道你的结果中有哪些数据,但你可以尝试这样的事情

var app = angular.module('app', ['ngAnimate', 'ngTouch', 'ui.grid']);

app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) {
  $scope.gridOptions = {
    enableSorting: true,
    rowHeight:100,
    columnDefs: [
      { field: 'name' },
      { field: 'company'  },
      { field: 'image', cellTemplate:"<img width=\"50px\" ng-src=\"{{grid.getCellValue(row, col)}}\" lazy-src>"}
    ],
    data:[
      {name:"Name1",company:"Company1",image:"http://cdn.flaticon.com/png/256/70689.png"},
      {name:"Name2",company:"Company2",image:"http://cdn.flaticon.com/png/256/70689.png"},
      {name:"Name3",company:"Company3",image:"http://cdn.flaticon.com/png/256/70689.png"}
      ]
  };

}])