Just getting started with Angular and I've encountered a small issue. Within my template for SirroccoListing, I have the following code. Sirrocco is a directive:
<h3>All Sirroccos</h3>
<div sirrocco ng-repeat="sirrocco in sirroccos"
idx="{{ $index }}"></div>
<div sirrocco ng-model="sirroccoListing.addSirrocco"
idx="{{ sirroccos.length }}"
add-button="true"
class="add-sirrocco"></div>
Essentially, what I am trying to achieve is to display all the [sirroccos] and then add another slightly different sirrocco (as an add-button).
The [sirroccos] (an array in the scope) are loaded via a REST call and can be updated, which is functioning correctly. The issue arises when I want the add-button sirrocco to be rendered after the [sirroccos], with the idx attribute being important. How can I achieve this? It should also be re-rendered when the number of [sirroccos] changes.
I hope my explanation is clear and someone can offer assistance.
Wishing you a wonderful day ahead!