Rather than build a static test page, I literally hacked the AngularJS code into a MVC view using Html.Raw() wrappers to force the angularjs code to the browser - fairly confident this is NOT the way to do it as it's a real pain to do, but I did it anyway!

But, there is a Flash of Unformatted Content (FOUC) showing the place-holders i.e. {{x.artistid}} & {{x.artistname}}, so....I have built this static page from the View Source of the dynamic MVC page to see if it disappears and to show you it working.

Sadly, the FOUC is still evident :-(

Gone in a flash! Well documented on the web - rather than use {{x.artistid}} & {{x.artistname}}, using the ng-bind directive removes the unformatted content.

A bit of how-it-works: the text box at he top has a ng_modle="myFilter". This is used to get the text as a filter for use in

ng-repeat="x in names | orderBy:myOrderBy | filter:myFilter"

Nearly forgot - this also sorts by the column header i.e. click on the column heading sorts by that column.