Пожалуйста, посмотрите фрагмент, мне нужно добавить 3 поля, нажав кнопку отзывов.Как одно текстовое поле, одно поле электронной почты и одна кнопка «Отправить».Теперь нажмите кнопку обзора. Я вызываю некоторые текстовые данные, но хочу удалить их и добавить эти 3 поля.
var app = angular.module("MyApplication", []);
app.controller("MyController", function ($scope) {
$scope.BookClicked = {};
$scope.BookDetails = [{
Name: "Star Wars",
Image: "Images/pic.png",
Description: "The process of designing, writing, testing, debugging.",
Specifications: { NoofPages: "80", BookType: "Paper book" },
Reviews: [{ Ratethebook: "gdgdg", ShortReview: " vc", EmailId: " gf" }],
Addtocart: "Under Maintainece"
},{
Name: "Coading Book",
Image: "Images/pic2.png",
Description: "Programming is to find a sequence of instructions that will automate.",
Specifications: { NoofPages: "180", BookType: "HardBound" },
Reviews: [{ Ratethebook: "gdgdg", ShortReview: "hg ", EmailId: " uy" }],
Addtocart: "Under Maintainece1"
}];
$scope.GetDescrp = function (Book) {
$scope.BookClicked = Book;
Book.output = Book.Description;
}
$scope.Getaddtocart = function (Book) {
$scope.BookClicked = Book;
Book.output = Book.Addtocart;
}
$scope.GetSpecification = function (Book) {
$scope.BookClicked = Book;
Book.output = Book.Specifications.NoofPages + Book.Specifications.BookType;
}
$scope.GetReviews = function (Book) {
$scope.BookClicked = Book;
Book.output = Book['Reviews'][0].Ratethebook + Book['Reviews'][0].ShortReview + Book['Reviews'][0].EmailId;
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.9/angular.min.js"></script>
<body ng-app="MyApplication">
<div ng-controller="MyController">
<div data-ng-repeat="Book in BookDetails">
<h1>{{Book.Name}}</h1>
<button data-ng-click="GetDescrp(Book);">Description</button>
<button data-ng-click="GetSpecification(Book);">Specifications</button>
<button data-ng-click="GetReviews(Book);">Reviews</button>
<button data-ng-click="Getaddtocart(Book);">Add To Cart</button>
<div ng-show="Book === BookClicked" style="background:yellow">
<hr>
<b>Output</b>: {{Book.output}}
<hr>
</div>
</div>
</div>
</body>