Я пытался отсортировать данные таблицы по щелчку (ng-click, если я использую angularJS) Я получаю данные из базы данных.Мне нужна только функция сортировки, если это произойдет через angularJs, я был бы очень рад
Вот то, что я делал до сих пор, я мало что сделал, так как я новичок в AngularJS
@model WebApplication3.Models.StudentModel
@{
ViewBag.Title = "Index";
}
<h2>Students</h2>
<div><button class="create btn btn-success"><span class="glyphicon glyphicon-plus"></span> Create New</button></div>
<br/>
<table class="table" ng-app="StudentApp">
<tbody ng-controller="StudentCtrl">
<tr>
<th>Key</th>
<th ng-click="">First Name</th>
<th ng-click="">Last Name</th>
<th>Profile picture</th>
<th>Options</th>
</tr>
@foreach (var student in Model._StudentList)
{
<tr>
<td>@student.StudentID</td>
<td>@student.FirstName</td>
<td>@student.LastName</td>
<td>
<a class="example-image-link" href="~/Images/@student.PhotoURL" data-lightbox="example-set" data-title="@student.FirstName @student.LastName profile Picture"><img class="example-image" width="60" height="40" src="~/Images/@student.PhotoURL" alt="" /></a>
</td>
<td>
<a href="#" class="edit" data-studentid="@student.StudentID"><span class="glyphicon glyphicon-pencil img-rotate" title="Edit"></span></a>
<a href="#" class="details" data-studentid="@student.StudentID"><span class="glyphicon glyphicon-exclamation-sign img-rotate" title="Infomation"></span></a>
<a href="#" class="delete" data-studentid="@student.StudentID"><span class="glyphicon glyphicon-remove img-rotate" title="Remove"></span></a>
</td>
</tr>
}
</tbody>
</table>
Мне нужно отсортировать firstName, LastName, когда они нажимают на соответствующий тег th
Спасибо
В AngularJS есть фильтр таблицы сортировки, его имя - OrderBy ( документация )
В настоящее время вы не можете использовать это в своем коде , потому что фильтр OrderBy работает только в том случае, если AngularJS записывает себя в таблицу .
Пример :
<table class="friend">
<tr>
<th>
<a href="" ng-click="order('name')">Name</a>
<span class="sortorder" ng-show="predicate === 'name'" ng-class="{reverse:reverse}"></span>
</th>
<th>
<a href="" ng-click="order('phone')">Phone Number</a>
<span class="sortorder" ng-show="predicate === 'phone'" ng-class="{reverse:reverse}"></span>
</th>
<th>
<a href="" ng-click="order('age')">Age</a>
<span class="sortorder" ng-show="predicate === 'age'" ng-class="{reverse:reverse}"></span>
</th>
</tr>
<tr ng-repeat="friend in friends | orderBy:predicate:reverse">
<td>{{friend.name}}</td>
<td>{{friend.phone}}</td>
<td>{{friend.age}}</td>
</tr>
</table>
В вашем случае таблица написана в представлении, и я думаю, что единственный способ сделать это сейчас с вашим кодом - использовать плагин jQuery. К сожалению, вы теряете силу AngularJS ...
Решение :
Решением было бы использовать атрибут ng-init:
<div ng-app="" ng-init="names=[
{name:'Jani',country:'Norway'},
{name:'Hege',country:'Sweden'},
{name:'Kai',country:'Denmark'}]">
<ul>
<li ng-repeat="x in names">
{{ x.name + ', ' + x.country }}
</li>
</ul>
</div>
И вы можете использовать переменную names в своем контроллере, например:
console.log($scope.names); // Display the names
Эта статья взята из Интернета, укажите источник при перепечатке.
Если есть какие-либо нарушения, пожалуйста, свяжитесь с[email protected] Удалить.
я говорю два предложения