javascript - AngularJS : How to make dynamic field button only for last button? -
in dynamic input field there option implement plussign = true
last item ?
(function() { var app = angular.module('managementapp', []); // var app = angular.module('managementapp', ['ngroute']); app.controller('phonebookcontroller', function($scope, $http) { $scope.dynamicfield = function(buttonstatus, inputindex) { if (!buttonstatus) { $scope.currentcontact.contacts.push({ "phone": "" }); } else { $scope.currentcontact.contacts.splice(inputindex, 1); } }; $scope.currentcontact = [{ "phone": "07875 506 426" }, { "phone": "+91 9895 319991" }, { "phone": "+44 7875 506 426" }]; $scope.dynamicfield = function(buttonstatus, inputindex) { if (!buttonstatus) { $scope.currentcontact.push({ "phone": "" }); } else { $scope.currentcontact.splice(inputindex, 1); } }; $scope.checkindex = function(totalcount, indexcount) { indexcount++; // alert(indexcount); /*if (totalcount === indexcount) { //alert("last one"); $scope.plussign = true; }else{ $scope.plussign = false; }*/ }; }); })();
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div class="container" ng-app="managementapp"> <div class="row" ng-controller="phonebookcontroller"> <div class="form-group" ng-repeat="contact in currentcontact" ng-init="checkindex(currentcontact.length, $index);"> <label for="contact-number3" class="col-sm-3 control-label">contact number {{$index + 1 }}</label> <div class="col-sm-9"> <div class="input-group"> <input type="tel" class="form-control" placeholder="contact number {{$index + 1 }}" ng-model="contact.phone"> <span class="input-group-btn"> <button class="btn btn-default" type="button" ng-init="plussign = true" ng-click="plussign = !plussign; dynamicfield(plussign, $index);"> <i class="glyphicon " ng-class="plussign ? 'glyphicon-plus' : 'glyphicon-minus'"></i> </button> </span> </div> </div> </div> </div> </div>
you can use $last inside ng-repeat true if repeated element last in iterator. or can css .row:last-of-type {/**/}.
Comments
Post a Comment