Collection-Repeat with Dynamic List - Possible?

I’m attempting to use collection-repeat to solve the performance problem created with long lists rendered with ng-repeat. Can collection-repeat be used to render a list a user is actively adding items to?

This is my list:

 <ion-content overflow-scroll="false">
           <ion-item collection-repeat="pack in packs track by" ng-click="packDive(pack)">	

                    <ion-option-button  ng-click="rejectPack(pack)">

                    <ion-option-button ng-click="auditPack(pack)">

                    <div class="row"> 	
                        <status-icon ng-if="stagedPack(pack)"></status-icon>
                        <status-icon ng-if="packAudit(pack)"></status-icon>

                        <img ng-if="hotItem(pack)" src="components/images/hot-item-indicator.svg"/>
                        <img ng-if="damagedPackSingle(pack)" src="components/images/reject-item-indicator.svg">

                        <div class="col">

                        <div class="col">
                            <div class="pack-info-id">{{}}</div>

                        <div class="col">
                            <i class="icon ion-chevron-right"></i>

When the user enters another pack id, it adds a record to the packs array. So this list will continue to grow.

Collection repeat sounds ideal, but I can’t get it to work. It shows the first item the user adds but nothing after that. I can see the items being added in the html (its even adding them twice for some reason??), but nothing in the view.

Any ideas on how to make collection-repeat work for this or is there a better approach to this problem?