filter by obj expression: <h3>Unregistered Users</h3> <div ng-repeat=”user in users | filter:{registered:false}”> <div class=”row-fluid”> <div class=”span2″> {{user.name}} </div> </div> </div> JSFiddle: http://jsfiddle.net/alfrescian/9ytDN/
Scenario 1: <li ng-repeat=”item in ::items”>{{::item.name}}</li> Both expressions will be one-time bound. Adding an item or changing an existing item’s name will not be reflected. Demo: http://plnkr.co/edit/53r8FCmcNK4MmM6Uzxp2?p=preview Scenario 2: <li ng-repeat=”item in ::items”>{{item.name}}</li> First expression will be one-time bound. Adding an item will not be reflected. Changing an existing item’s name will be reflected. Demo: … Read more
As @c0bra pointed out in the comments the form.$error object is populated, it just doesn’t like being dumped out as JSON. Looping through form.$errors and it’s nested objects will get the desired result however. <ul> <li ng-repeat=”(key, errors) in form.$error track by $index”> <strong>{{ key }}</strong> errors <ul> <li ng-repeat=”e in errors”>{{ e.$name }} has … Read more
Best way to do this is to use a function: <div ng-repeat=”product in products | filter: myFilter”> $scope.myFilter = function (item) { return item === ‘red’ || item === ‘blue’; }; Alternatively, you can use ngHide or ngShow to dynamically show and hide elements based on a certain criteria.
I think this working CodePen example that I created will show you exactly how to do what you want. The template: <section ng-app=”app” ng-controller=”MainCtrl”> <span class=”label”>Ordered By: {{orderByField}}, Reverse Sort: {{reverseSort}}</span><br><br> <table class=”table table-bordered”> <thead> <tr> <th> <a href=”#” ng-click=”orderByField=’firstName’; reverseSort = !reverseSort”> First Name <span ng-show=”orderByField == ‘firstName'”><span ng-show=”!reverseSort”>^</span><span ng-show=”reverseSort”>v</span></span> </a> </th> <th> <a … Read more
Try to surround strings (hoot, story, article) with quotes ‘: <div ng-repeat = “data in comments”> <div ng-if=”data.type == ‘hoot’ “> //different template with hoot data </div> <div ng-if=”data.type == ‘story’ “> //different template with story data </div> <div ng-if=”data.type == ‘article’ “> //different template with article data </div> </div>
If you want to run some custom filter logic you can create a function which takes the array element as an argument and returns true or false based on whether it should be in the search results. Then pass it to the filter instruction just like you do with the search object, for example: JS: … Read more
There is no rocket science in deleting items from array. To delete items from any array you need to use splice: $scope.items.splice(index, 1);. Here is an example: HTML <!DOCTYPE html> <html data-ng-app=”demo”> <head> <script data-require=”angular.js@1.1.5″ data-semver=”1.1.5″ src=”https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js”></script> <link rel=”stylesheet” href=”style.css” /> <script src=”script.js”></script> </head> <body> <div data-ng-controller=”DemoController”> <ul> <li data-ng-repeat=”item in items”> {{item}} <button data-ng-click=”removeItem($index)”>Remove</button> … Read more
The orderBy only works with Arrays — See http://docs.angularjs.org/api/ng.filter:orderBy Also a great filter to use for Objects instead of Arrays @ Angularjs OrderBy on ng-repeat doesn’t work
It is possible to parse dynamic values in a couple of way. Interpolation with double-curly braces: ng-style=”{‘background-image’:’url({{myBackgroundUrl}})’}” String concatenation: ng-style=”{‘background-image’: ‘url(‘ + myBackgroundUrl + ‘)’}” ES6 template literals: ng-style=”{‘background-image’: `url(${myBackgroundUrl})`}”