{{names.name | limitTo:...">
Clever Geek Handbook

Ng-repeat filter with angular js condition

This is my code:

 <option ng-repeat="name in names" value="{{names.name}">
    {{names.name | limitTo:10 }}
 </option>

How to add a condition:

if( names.name.length > 10) { 
     //add ... point after name displayed 
}

to get the result <option value="Alexander Bradley">Alexander ... </option>

Any ideas?

+3


source to share


2 answers


You can create your own filter to do this and include a length parameter if you like.

.filter("ellipses", function () {
    return function (item) {
        if (item.length > 10) {
            return item.substring(0, 10) + " ..."
        }
        return item;
    };
});

<option ng-repeat="name in names" value="{{names.name}">
    {{names.name | ellipses }}
</option>


You can also include a length argument and even use limitTo

:

.filter("ellipses", ["$filter", function ($filter) {
    return function  (item, limit) {
        if (item.length > limit) {
            return $filter("limitTo")(item, limit) + " ...";
        }
        return item;
    };
}]);
+7


source


I think this is what you asked for .. Limiting the name to 10 characters and then adding "..." to the end if it exceeds 10 characters. This is how I will do it. (Also fixed some of your syntax errors).



<option ng-repeat="name in names" value="{{name}}">
    {{name.length <= 10 ? name : name.substring(0, 10) + "..."}}
</option>
+2


source






More articles:


All Articles