I'm currently using AngularJS and I have a requirement where I need to check if a student ID exists in the database when a user clicks a button. If the student ID is found in the database, I want to display #modal1, otherwise show #modal2. Is it achievable with AngularJS? And if so, how can I implement this?
HTML
<tr ng-repeat="g in students">
<td>{{g.studentId}}</td>
<td>{{g.studentName}}</td>
<td>
<div class="btn-group" role="group" aria-label="btnActions">
<button type="button" ng-click="act(g)" title="act" data-toggle="modal" data-target="#deleteModal"></button>
</div>
</td>
</tr>
#Modal that will be displayed
<!-- modal1 -->
<div class="modal fade" id="modal1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
confirm delete?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" ng-click="delete()">Yes</button>
<button type="button" class="btn btn-default" > No</button>
</div>
</div>
</div>
</div>
<!-- modal2 -->
<div class="modal fade" id="modal2" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
Data already existed
</div>
</div>
</div>
</div>
Controller
$scope.act = function (g) {
g.studentId;
}