CODEWITHSUNDEEP
javascriptangularjshtml
David Tunnell
David Tunnell

Reputation: 7532

Passing ng-repeat current object outside of loop

I have an ng-repeat which creates a list of rows within a larger div. Because I don't want my button to be repeated with the data coming in, I have a button outside of it.

            <div class="modal-content">
                <div class="modal-body">
                    <table class="table table-bordered">
                        <thead data-ng-if="contracts.length!=0">
                            <tr>
                                <th>CONTRACT&nbsp;#</th>
                                <th>PROGRAM</th>
                                <th>DISC&nbsp;%</th>
                                <th>REBT&nbsp;%</th>
                                <th>Award&nbsp;Type</th>
                            </tr>
                        </thead>
                        <tbody data-ng-repeat="(contractIndex, contract) in contracts">
                            <tr>
                                <td>
                                    <input bind-once class="form-control input-sm" data-ng-model="contract.CONTRACT_NUM_VAL" />
                                </td>
                                <td><input bind-once type="text" ng-disabled="true" class="form-control input-sm" data-ng-model="contract.GM_PROGRAM" /></td>
                                <td><input bind-once type="number" class="form-control input-sm" data-ng-model="contract.DISCOUNT_PCT" /></td>
                                <td><input bind-once type="number" class="form-control input-sm" data-ng-model="contract.REBATE_PCT" /></td>
                                <td><input bind-once type="text" class="form-control input-sm" maxlength="1" data-ng-model="contract.AWARD_TYPE" /></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal" data-ng-click="addUpdatedContract(contract)">Add</button>
                </div>
            </div>

I want to pass the current contract object to my function addUpdatedContract(contract); But because it outside of the scope of data-ng-repeat I get null.

How can I pass the current contract to the function outside of the ng-bind directive?

Upvotes: 0

Views: 583

Answers (2)

quirimmo
quirimmo

Reputation: 9988

Simply: you can't.

Using ng-repeat-start and ng-repeat-end may help you:

https://docs.angularjs.org/api/ng/directive/ngRepeat#special-repeat-start-and-end-points

Otherwise you have to find a workaround. For every iteration, call a function in the controller and store that value. Then you can trigger what you want from that list. But actually this doesn't make sense at all. It would be the same as starting a new ng-repeat below the first one.

But now the question is: you need only a modal? which object of the ng-repeat do you want to pass to the modal? the first? the last? the second? In my opinion it doesn't make too much sense what you are trying to do. I think that in your case ng-repeat-start and ng-repeat-end will do the job

Upvotes: 1

ukn
ukn

Reputation: 1793

Since you will always have one object you could use: contracts[0]

<div class="modal-footer">
     <button type="button" class="btn btn-default" data-dismiss="modal" data-ng-click="addUpdatedContract(contracts[0])">Add</button>
</div>

Upvotes: 1

Related Questions