I have a question. How to display on a pop-up window the information from the previous window. I have this code. It is my main html page
<body ng-app = "smartDeals" ng-controller = "smartDealsController as controller" >
<div class = "text">
<md-card md-theme="{{ 'dark-grey'}}">
<h1>Pizza Exemple</h1>
</md-card>
<div class='md-padding' layout="row" layout-wrap>
<md-card md-theme="{{ 'dark-grey'}}" style="width: 350px;" ng-repeat="pizza in controller.pizzas">
<%= image_tag('6.jpg', style: "height: 250px; width: 350px") %>
<md-card-content>
<h2>{{pizza.name}}</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua</p>
</md-card-content>
<div class="md-actions" layout="row" layout-align="end center">
<md-button class="md-primary md-raised" ng-click="showAdvanced($event)" flex="100" flex-gt-md="auto">
Buy
</md-button>
</div>
</md-card>
</div>
</div>
<%=yield%>
</body>
It is my controller
(function(){
var app = angular.module('smartDeals', ['ngMaterial','ngMessages']);
app.config(function($mdThemingProvider) {
$mdThemingProvider.theme('dark-grey').backgroundPalette('grey').dark();
$mdThemingProvider.theme('dark-orange').backgroundPalette('orange').dark();
$mdThemingProvider.theme('dark-purple').backgroundPalette('deep-purple').dark();
$mdThemingProvider.theme('dark-blue').backgroundPalette('blue').dark();
});
app.controller('smartDealsController',function($scope,$mdDialog,$mdMedia){
var web3 = new Web3();
this.pizzas = pizzas;
$scope.showAdvanced = function(ev) {
$mdDialog.show({
controller: function DialogController($scope, $mdDialog) {
$scope.hide = function() {
$mdDialog.hide();
};
$scope.cancel = function() {
$mdDialog.cancel();
};
$scope.answer = function(answer) {
$mdDialog.hide(answer);
};
},
templateUrl: 'solution_controller/index',
parent: angular.element(document.body),
targetEvent: ev,
clickOutsideToClose:true,
fullscreen: $scope.customFullscreen // Only for -xs, -sm breakpoints.
})
.then(function(answer) {
$scope.status = 'You said the information was "' + answer + '".';
}, function() {
$scope.status = 'You cancelled the dialog.';
});
};
});
var pizzas = [
{
name: 'Vegetariana',
price: 400,
description: 'Very good pizza!',
images: [
"assets/images/1.png",
"assets/images/1.png",
"assets/images/1.png"
],
},
{
name: 'Quattro Formaggi',
price: 300,
description: 'Very good pizza!',
images: [
"assets/images/1.png",
"assets/images/1.png",
"assets/images/1.png"
],
},
{
name: 'Maltija (Maltese)',
price: 300,
description: 'Very good pizza!',
images: [
"assets/images/1.jpg",
"assets/images/1.jpg",
"assets/images/1.jpg"
],
}
];
})();
And pop-up window
<md-dialog ng-app = "smartDeals" ng-controller = "smartDealsController as controller" >
<form>
<md-dialog-content>
<div class="md-dialog-content">
<h2>{{pizza.name}}</h2>
</md-dialog-content>
<md-dialog-actions layout="row">
<span flex></span>
<md-button ng-click="hide()">Hide</md-button>
</md-dialog-actions>
</form>
</md-dialog>
I want to display on a pop-up window the information of only one pizza, to which the user clicked. I think I need some way to save the variable, which after clicking on the button will be pizza index entry of an array. But I do not know how to implement it.