Does it solve your problem? function MainCtrl($scope) { $scope.queryList = [ { name: ‘Check Users’, fields: [ “Name”, “Id”] }, { name: ‘Audit Report’, fields: [] }, { name: ‘Bounce Back Report’, fields: [ “Date”] } ]; $scope.models = {}; $scope.$watch(‘selectedQuery’, function (newVal, oldVal) { if ($scope.selectedQuery) { $scope.parameters = $scope.selectedQuery.fields; } }); } And … Read more
In did that for AngularJS v1.2+ HTML: <span ng-bind-html=”highlight(textToSearchThrough, searchText)”></span> JS: $scope.highlight = function(text, search) { if (!search) { return $sce.trustAsHtml(text); } return $sce.trustAsHtml(text.replace(new RegExp(search, ‘gi’), ‘<span class=”highlightedText”>$&</span>’)); }; CSS: .highlightedText { background: yellow; }
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.
We now have a proper support for this, please see: AngularJs Commmit with this change you can now do: <table> <tr ng-repeat-start=”item in list”> <td>I get repeated</td> </tr> <tr ng-repeat-end> <td>I also get repeated</td> </tr> </table>
It seems angular doesn’t do event delegation with repeaters. Someone opened an issue on github about it. The argument is if it actually leads to better performance. There might be a workaround but it would require jQuery. It consists of creating a special directive to be used on a parent element and register the listener … Read more
Can anyone explain to me why are the inputs uneditable/readonly? If it’s by design, what’s the rationale behind? It is by design, as of Angular 1.0.3. Artem has a very good explanation of how 1.0.3+ works when you “bind to each ng-repeat item directly” – i.e., <div ng-repeat=”num in myNumbers”> <input type=”text” ng-model=”num”> When your … Read more
Late to the party, but there is a little angular ‘hack’ to achieve this without implementing a dumb directive. Adding a built-in directive that will extend your controller’s scope (like ng-if) everywhere you use the ng-include will actually let you isolate the variable name for all the included scopes. So: <div ng-include=”‘item.html'” ng-if=”true” onload=”item = … Read more
You can do something like <div ng-app=”test-app” ng-controller=”MyController”> <ul id=”contents”> <li ng-repeat=”content in contents”> <div class=”title”>{{$index}} – {{content.title}} – {{contents[$index – 1]}}</div> </li> </ul> </div> JS var app = angular.module(‘test-app’, []); app.controller(‘MyController’, function($scope){ $scope.contents=[{ title: ‘First’ }, { title: ‘Second’ }, { title: ‘Third’ }] }) Demo: Fiddle Be careful: $index is for the directive … Read more
It’s because angularJS automatically trimmed your model. If you’re using angularJS 1.1.1 or newer, add ng-trim=”false” to textarea. Working example: http://jsfiddle.net/9DbYY/
No need to code anything, angular has done this with the existing built-in limitTo filter. Just use a negative limit. From the docs for the limit argument: The length of the returned array or string. If the limit number is positive, limit number of items from the beginning of the source array/string are copied. If … Read more