I am creating a grid of checkboxes to enable a user to select different events and age classes for an athletics meeting. The events are the columns, the classes are the rows.
Here's the plunk: http://plnkr.co/edit/j6gRR18qXCDNCMQ9VDNG?p=preview
I first created this with an nested ng-repeat. It works, but is very slow to load which is apparently due to the creation of data bindings and watches. To speed things up, I wrote a directive to do the nested looping and the building of the html.
The checkboxes are bound to a two dimensional array - classevent[][].
The problem is that I cannot get the bindings to work with the directive.
Here are the steps to see the problem in Plunker:
When it finally loads, open the console and then scroll down the grid to the bottom - column 201, row 32. Click save and you get false in the console. Check the box 201,32 and click save again. It's true. So the data binding is working.
Now go to the html and comment out the tbody.../tbody and uncomment the tbody classeventgrid.../tbody directive as described in the code.
It loads much faster, but if you do the same as before, you will see that the bindings are broken.
Can anyone tell me what I have done wrong?