2016-12-05 3 views
0

У меня есть таблица с данными в ng-repeat. В колонке представлены фотографии. Когда я редактирую определенные данные в таблице, должна отображаться фотография данных, которые я выбрал. Как я могу это сделать?Просмотреть выбранное фото внутри ng-repeat в другом div

В моей таблице код идет как этот

<td> 
    <img ng-src='{{ item.photo }}' height='50px'> 
</td> 

И в моем другом DIV она идет, как этот

<img ng-src='pphoto' style="float:right;width:200px;height:100px;" alt="img"/> 

ответ

0

Вы можете передать элемент с помощью функции на нг кнопкой мыши и связать что к переменной. Demo

var app = angular.module("app", []); 
 

 
app.controller("listController", ["$scope", 
 
    function($scope) { 
 
    $scope.options = [{ 
 
     'title': 'Title1', 
 
     'label': 'Zip code', 
 
     'type': 'xxx', 
 
     'photo': 'https://lh4.ggpht.com/wKrDLLmmxjfRG2-E-k5L5BUuHWpCOe4lWRF7oVs1Gzdn5e5yvr8fj-ORTlBF43U47yI=w300' 
 
    }, 
 
    { 
 
     'title': 'Title2', 
 
     'label': 'Zip code2', 
 
     'type': 'yyyy', 
 
     'photo': 'https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcSSYBkITzCk_4rBfHIkRTwSLf_VJ5OqmPCrLZV7mZZ2s8RzZJgf5RFhzJ0' 
 
    } 
 

 
    ]; 
 

 
    $scope.pphoto; 
 

 
    $scope.assign = function(item) { 
 

 
     $scope.pphoto = item.photo; 
 
    } 
 
    } 
 
]);
<!doctype html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script> 
 
    <script src="script.js"></script> 
 
</head> 
 
<body> 
 
<div ng-controller="listController"> 
 
    <div> 
 
     <table> 
 
     <td ng-repeat="item in options"> 
 
      <img ng-src='{{item.photo}}' height='50px'> 
 
      <button ng-click="assign(item)">EDIT</button> 
 
     </td> 
 
     </table> 
 
     <div>Q 
 
     <img ng-src='{{pphoto}}' alt="img" /> 
 
     </div> 
 
</body> 
 
</html>

 Смежные вопросы

  • Нет связанных вопросов^_^