I'm building a MEAN stack app for tracking courses, grades, and assignments. I'm trying to generate delete buttons for courses in my index view. All the expressions render correctly except for course._id in the following table. It is referred to within an ng-click value, so is not braced.
<tbody>
<tr ng-repeat="course in courseData">
<td>{{course.name}}</td>
<td>{{course.courseNum}}</td>
<td>{{course.students.length}}</td>
<td>
<ul ng-repeat="comment in course.comments">
<li>{{comment}}</li>
</ul>
</td>
<td>
<button type="button" class="btn btn-danger" ng-click="remove(course._id)">Delete</button>
</td>
</tr>
</tbody>
The remove function is very straightforward. It sends a delete call to the API and renders the index state again.
$scope.remove = function (courseId) {
$http.delete("/api/courses/" + courseId);
$state.go('courseState');
};
It seems like I'm probably missing something simple. Course._id will render outside the ng-click with the curly braces, but the braces can't be used in the ng-click attribute.
Most of the solutions I've found were all about creating directives, but getting that value inside the ng-click attribute should be as simple as just passing course._id as the argument.