AmirHM AmirHM - 4 months ago 8
AngularJS Question

Angular, sort by enting property as text input

I want to sort a list of comments by different properties such as rating, date,...
but not using buttons and get property as text in input.

by default the property is rating, but ng-repeat does not publish any thing.

my code is:

<div ng-controller="controller as Ctrl">
<p>SortBy: <input type="text" name="input" ng-model="Ctrl.dish.sortProperty"></p>
<blockquote ng-repeat="comment in Ctrl.dish.comments | orderBy:'{{Ctrl.dish.sortProperty}}'">
<p>{{comment.rating}}</p>
<p>{{comment.comment}}</p>
<footer>{{comment.author}} ,<cite title="Source Title">{{comment.date| date:'mediumDate'}}</cite></footer>
</blockquote>
</div>


and the controller as:

<script>

var app = angular.module('myApp',[]);
app.controller('controller', function() {
var dish={
sortProperty:'rating',
comments: [
{
rating:5,
comment:"blablalbla",
author:"John Lemon",
date:"2012-10-16T17:57:28.556094Z"
},
{
rating:4,
comment:"blablabla",
author:"Paul McVites",
date:"2014-09-05T17:57:28.556094Z"
},
{
// more comments
}
]};
this.dish = dish; });
</script>

Answer

Remove the single quotes and the interpolation {{ }}:

<blockquote ng-repeat="comment in Ctrl.dish.comments | orderBy: Ctrl.dish.sortProperty">