One way binding + dynamic binding in AngularJS

I will start by explaining what we are trying to achieve.

We have just jumped on the Angular bandwagon and are building a prototype with it to see what it is capable of.

Currently there is a load of data (grades in this case) on the server and we display that data using Angular.

The following is the code we use:

<ul class="phones">
    <li class="list-group-item" onclick="toggleExpandedView(this, true, 500)" ng-repeat="grade in grades | filter:query | orderBy:orderProp">

        <span ng-show="grade.comment"><img src="../Content/images/comment.gif"/></span>

        <a class="btn btn-primary editButton" style="float: right; position: absolute; right:10px;" ng-href="#/grades/{{grade.gradeId}}">Edit</a>

        <div class="heading1"><a ng-href="{{grade.url}}" target="_blank">{{grade.gradeValue}}</a></div>
        <div>Provided by <a href="#">{{grade.assessorFirstname}} {{grade.assessorLastname}}</a> on {{grade.dateModifiedFormatted}} </div>

        <div class="expandedGrade" onclick="childDivClick(event)" style="display: none" id="grade-{{grade.gradeId}}">
            <label>Attachments</label>{{grade.attachmentCount}}
            <br />

            <span ng-hide="editing" ng-click="editing = true"><b>{{grade.comment || 'No comments yet'}}</b></span>
            <form ng-show="editing" ng-submit="editing = false">
                <input type="text" ng-model="grade.comment" placeholder="Comment" ng-required />
                <br />
                <input id="saveChanges" type="submit" class="btn btn-primary" ng-click="saveChanges(this, grade)" text="Save changes" />
            </form>

        </div>
    </li>
</ul>

As you can see we have a parent ul and for each grade in grades we simply display a li and a div that is hidden and when you click on the li we use jQuery to animate and display the hidden div. In the child div we have a comments field which users can update and click save. On save the current object gets fired back to the server however we are concerned about the fact that Angular has to go through all 2000 grades until it finds the one we are updating (due to two way binding) and this means that everything will be really slow and we cannot afford that.

This is what we want to achieve:

1 We want to bind the data one way so that we can display the list of all grades on the screen and as soon as they are all displayed we want to somehow remove the bindings.

2. When users update the comments for a particular grade we then want to dynamically bind that particular grade so that Angular knows exactly which one it has to update without having to go through the whole collection of 2000+ grades.

I have find a tutorial however I am still unsure how to integrate that into my code.

I have also watched this video and I understand the concept behind it but again, I am struggling to write something that actually works ( we have just started using Angular so I am pretty much a newbie)

Could anyone out there point me in the right direction and provide me with some code samples that would solve the issue we are facing? Any advice and help would be greatly appreciated