MVC Model List to AngularJs - html

Question

I do have a Model that have studentID, firstName, LastName, PhotoURL and a list, I tried to bind the model to angularJs like this
var app = angular.module('StudentApp', []);
app.controller('StudentCtrl', function ($scope) {
$scope.model = #Html.Raw(Json.Encode(Model));
console.log($scope.model);
});
when i console.log
it showing me like this
Object {StudentID: 0, FirstName: null, LastName: null, PhotoURL: null, _StudentList: Array[5]}
FirstName: null LastName: null PhotoURL: null StudentID: 0 _StudentList:Array[5]
0: Object
FirstName: "John"
LastName: "Doe"
PhotoURL: "phone-wallpaper-1920x1200.jpg"
StudentID: 5
_StudentList: null__proto__:
1: Object
FirstName: "Ahri"
LastName: "Fox"
PhotoURL: "ahri-wallpaper-1920x1200.jpg"
StudentID: 6
_StudentList: null__proto__:
Object2:
Object3:
Object4:
It means that I got the data of five students, now i want to use ng-repeat and print those five student data
i tried like this
<table class="table" ng-app="StudentApp">
<tbody ng-controller="StudentCtrl">
<tr>
<th>Key</th>
<th>First Name</th>
<th>Last Name</th>
<th>Profile picture</th>
<th>Options</th>
</tr>
<tr ng-repeat="student in $scope.model._StudentList">
<td></td>
<td>{{student.FirstName}}</td>
<td>{{student.LastName}}</td>
</tr>
}
</tbody>
but its not working
wherever if i console log like this its working
console.log($scope.model._StudentList[0].FirstName);
console.log($scope.model._StudentList[0].LastName);
its printing John Doe

Answer 1

You should not use $scope in ng-repeat just make it model._StudentList then it will work .