How to validate input field inside ng-repeat

Question

I want to validate an input field where i want to be able to check whether the current input is greater than the previous input.

Here is what i mean

        <div class="col-xs-10" ng-repeat="period in trim.rent_period" >
                                    <div class="col-xs-6">
                                        <div class="form-group">
                                            <label class="col-xs-5 control-label" for="rentperiod">Rental Period
                                                <span class="colon--label">:</span>
                                            </label>
                                            <div class="col-xs-6">
                                                <input id="rentperiod" name="rentperiod" type="text" class="form-control" ng-model="rent.period" ng-change="checkRentPeriod($index);" required>                                            
                                            </div>
                                        </div>
                                    </div>
    </div>

<div class="col-xs-2">
                                <i class="pull-left fa fa-plus-circle add-rent--icon" ng-click="addRent(currentIndex);"></i>
                            </div> 

Here the add button adds an input into the list , and i want to make sure that the current input is greater than the previous input.

Answer 1

Try to wrap your code with form tag. And then check for validation of form if everything is okay. You can do this by following this guide here as a way to solve your question

https://docs.angularjs.org/guide/forms

Answer 2

change your ng-model="rent.period" to correct, something starting from "period", like ng-model="period.rent"

no need for extra method ng-change="checkRentPeriod($index);"

add that simple block after input:

<span ng-if="$index > 0 && period.rent && period.rent > trim.rent_period[$index - 1].rent">
    Rent is greater than {{trim.rent_period[$index - 1]}}
</span>