w3hello.com logo
Home PHP C# C++ Android Java Javascript Python IOS SQL HTML videos Categories
- can't use a DIV
AngularJS: CSS classes, ng-repeat, search box
How about using ng-class to conditionally apply the class? <input ng-model="search" type="text" /> <ul> <li ng-repeat="item in items" ng-class="{'found': find(item.text, search)}">{{item.text}}</li> </ul> Then in your controller, something like this: $scope.find = function(text, search) { if(!text || !search) return false; return text.toLowerCase().indexOf(search.toLowerCase()) >= 0; }; Here is a working CodePen. If you prefer to use the existing filter implementation, you can pull it out and use it: function TestCtrl($scope, $filter) { var filterFilter = $filter('filter'); $scope.findViaFilter = function(text, search) { if(!text || !search) return false; return filterFilter([text], search).length > 0; };

Categories : Javascript

AngularJs filter on nested ng-repeat
What is the purpose to put the filter on the outer repeater? Just remove it. <div data-ng-repeat="(group, details) in group(reports, grouping)"> Demo

Categories : Angularjs

AngularJS nested-loop ng-repeat
One way of doing this is to create a controller in your row directive and then 'require' it in your column directive. In this context the controller is just a function which will be called when your parent directive is instantiated. Whatever is returned by the function will be passed to the directive requesting the controller in the 4th parameter of its 'compile' method. See my ng-scroller directive for an example Also see detailed description here

Categories : Angularjs

Nested ng-repeat in angularJS doesn't work
Actually the problem is not in ng-repeat directive but in incorrect scope usage. I think your $scope.get_badge function is defined in the controller and $scope used there is the controller's scope. So when get_badge called for 2 challenges then this line: $scope.filtered_badges = all_badges_URL; overwrites the previouly loaded badges, that's why you get the same badges for all challenges. The simplest solution is to but badges collection inside challenge object, like this: In javascript: myChallenge.filtered_badges = ... In html: <tr ng-repeat="myChallenge in ListChallengesICreated.challenges" ng-init="get_badge(myChallenge)"> <td class="cMLocation" ng-repeat="badge in myChallenge.filtered_badges" > <input type="image" ng-src="{{badge.imageURL}}" /> &

Categories : Javascript

Angularjs nested form input validation ng-repeat
Solved by adding escape to the dynamic name, jsfiddle.net/langdonx/6H8Xx/2 Code <div class="validation_error" ng-show="e.required && rowForm['{{e.name}}'].$error.required"> Required </div>

Categories : Angularjs

angularjs: nested ng-repeat creates blank values in selects
Since you use the n.id in the comprehension expression of the drop down list, you should pre-populate the offer.network with the id value like this network: $scope.networks[0].id And since the data is populated dynamically, you can do something like this. (For the demo purpose, I just use a very dumb way to populate the values. But you get the idea.) $scope.getNetworks().then(function(data){ $scope.networks = data; //populate the default value $scope.campaign.paths[0].offers[0].network = $scope.networks[0].id; $scope.campaign.paths[0].offers[1].network = $scope.networks[0].id; }) Working Demo

Categories : Javascript

How to make dynamically bound AngularJS models within nested ng-repeat not throw an error until the model is supplied data from somewhere else?
The problem (at least with your Fiddle) is that you are trying to bind to data[category.id][item.id].notes without either: $scope.data existing or being an object without $scope.data[category.id] existing or being an object and without $scope.data[category.id][item.id] existing and being an object. To solve it, after you load your data from the service, you need to loop through $scope.data and create every key you want as an object. You can do the following (verified and it works): app.controller('MainCtrl', function ($scope, configSvc) { $scope.data = {}; $scope.categoryConfig = $.extend({}, configSvc); angular.forEach($scope.categoryConfig.categories, function (category) { $scope.data[category.id] = {}; angular.forEach(category.items, function (item) {

Categories : Javascript

Why do nested classes in java differ from nested classes in C# in the following aspect?
The problem is that the way you have declared classes in Java, the inner class has an implicit reference to an instance of the outer class. Hence the error message: "error: an enclosing instance that contains outside.inside is required". This means you need to: Outside out = new Outside(); Outside.Inside in = out.new Inside(); In general, this pattern is used in Java in situations where it makes no sense for an instance of the inner class to exist without an instance of the outer class; and note that the inner class instance will have access to all of the outer class instance's variables, even private ones. But in general, such classes are generally private. In order for this to disappear, you must make the inner class static. And then you will be able to do: Outside.Inside in = new O

Categories : C#

What is best way to get angularjs ng-repeat variable to a directive called withn the repeat
What you are trying to do should work just fine. Here is an example... http://jsfiddle.net/HB7LU/4269/ <div ng-repeat="val in values"> <my-directive val="{{val}}">{{val}}</my-directive> You can see that the value from the repeater is easily binded into the child directive. Since you didn't provide any code, its hard to see where you are going wrong, but it might have something to do with the fact that you are using a table in your html. There was a bug in Angular, which was fixed in 1.2.13, related to repeating over table elements, since browsers actually manipulate the DOM inside of tables on their own sometimes. Please see this bug report regarding that issue. I would update to the latest version of Angular and try again. If you still can't get it working, try t

Categories : Angularjs

AngularJS Outer ng-repeat not to register watches on inner ng-repeat
You could write a directive that takes both users and items as bindings attributes (especially because it seems like your inner loop is independant from the outer one), then manually nest two loops that would add content to the DOM, plus adding a scroll listener to each element. It's more hard-way coding but a lot less watchers.

Categories : Javascript

angularjs: ng-repeat-start and ng-repeat-end with inner ng-repeat
You should be able to use index-based iterations to bypass that: <tr ng-repeat-start="obj in rows" > <td ng-repeat="e in obj.row">{{obj.row[$index]}}</td> </tr> <tr ng-repeat-end> <!-- ... -->

Categories : Angularjs

Alternative to static nested classes in C# for grouping a classes public methods?
Employee theEmployee = new Employee(); Would give you an Employee object to work with. With this you could change the values of the Employee class from DataBaseHandler

Categories : C#

Conditional classes applied in ng-repeat using $index inconsistent when filtering
In some places you use tags_and_devices[$index] and in some places you use item. item points to the actual item in the array that you're ng-repeating through, so, even when filtering, you get the item you expect. I don't fully understand what you want your code to be doing, but I think what you want is to only use item. tags_and_devices[$index] uses the index in the ng-repeat (not the index of the item in your model) to do a lookup in your model.

Categories : Javascript

AngularJS: ng-repeat for 2 x
It looks like the angularjs guys have implemented something along these lines. https://github.com/angular/angular.js/commit/e46100f7097d9a8f174bdb9e15d4c6098395c3f2 So the syntax would be <tr ng-repeat-start="item in items"></tr> <tr ng-repeat-end></tr>

Categories : Angularjs

ng-repeat a single element over nested objects
Just transform your object to an array... it's pretty easy in JS. Something like: $scope.data = { 'widget': { '1': 10, '2': 5 } }; var tableData = []; for (item in $scope.data) { var thing = item; for (subitem in $scope.data[thing]) { tableData.push({ thing: thing, price: subitem, amount: $scope.data[thing][subitem] }); } } I've created a jsfiddle with this example: http://jsfiddle.net/b7TYf/

Categories : Angularjs

What is the best way to access next/previous inputs nested within ng-repeat?
I think a more browser/user satisfying approach would be to use the tabindex attribute. You can spit out this attribute on each input element and use the $index value to get the iteration number that ng-repeat is on. A lot of browsers and mobile devices hook into this attribute to provide navigation through forms and lists (e.g. the forward/back arrows in iOS when focused on a form input) Another solution is use a directive each element <input focus-this="{{$index}}"></input> Then directives.directive('focusThis', function(){ return { link: function (scope, element, attrs){ scope.$watch('focusedIndex', function(newVal, oldVal){ if (newVal == attrs['focus-this']){ element.focus(); }

Categories : Angularjs

Nested ng-repeat on data of uneven depth
I haven't tested it but, I believe you can just not show your ul if there is no menu.submenu (that's what you want right?) by adding something like data-ng-show="menu.submenu" to your inner ul. Like this: <ul class="nav" ng-controller="NavCtrl"> <li ng-repeat="menu in menus"> <a href="{{menu.url}}"> {{menu.name}} </a> <ul data-ng-show="menu.submenu"> <li ng-repeat="submenu in menu.submenu"> <a href="{{submenu.url}}"> {{submenu.name}} </a> </li> </ul> </li> </ul> Perhaps you'll need a better test, or set submenu to false, as I'm not sure an empty array or object will behave as I'm expecting, but I'm pretty sure that's the general idea.

Categories : Angularjs

ng-repeat unknown number of nested elements
You need a recursive directive. Something like this, or probably better this.

Categories : Javascript

How to use AngularJS ng-repeat on
You can use ng-repeat-start directive: <ul> <li ng-repeat-start="airport in airports">{{airport.code}}</li> <li>{{airport.city}}</li> <li ng-repeat-end>{{airport.name}}</li> </ul> Here it is working in plnkr.

Categories : Angularjs

Using AngularJS, which is optimal with regards to ng-repeat
After typing it out, I think the best option would be to have one tools panel, and populate it depending on which 'panel toggle' button is clicked. Fewer DOM elements the better, right? It also leave it open for lazy-loading of the extra details in the future.

Categories : Performance

Angularjs - how to use select with ng-repeat?
You need to fix a few things in your <select> element: use color.id as color.name in your ng-options. ng-options="color.id as color.name for color in colors" you typoed "colorid": ng-model="user.colorId" Here's a plunk of it working: http://plnkr.co/edit/DptvZuamWv9waFzI0Rcp?p=preview

Categories : Angularjs

why angularjs ng-repeat not working
users must refer to a property that is accessible on the current scope. Scopes are AngularJS way of tying data from and to HTML. This is explained further in the "Model and Controller" chapter of the second tutorial page. See a working version of your Fiddle here. HTH!

Categories : Javascript

AngularJS ng-repeat in this model
You can change the data model like this function Ctrl($scope) { $scope.items = [{ item1: 1, item2: 'a', item3: 'a1' }, { item1: 2, item2: 'b', item3: 'b2' }, { item1: 3, item2: 'c', item3: 'c3' }, ...]; } <div ng-app ng-controller="Ctrl"> <table> <tbody> <th>item1</th> <th>item2</th> <th>item3</th> <tr ng-repeat="item in items">{{item}} <td>{{item.item1}}</td> <td>{{item.item2}}</td> <td>{{item.item3}}</td> </tr> </tbody> </table> </div> DEMO

Categories : Javascript

Filter ng-repeat on Angularjs,
<tr ng-repeat="data in dataset | filter:filterFunction"> <td>{{data.id}}</td> <td>{{data.name}}</td> </tr> Controller: $scope.filterFunction = function(data) { return $scope.filterValues.indexOf(data.id) !== -1 ? true : false; }; $scope.filterValues = [12, 14, 23];

Categories : Angularjs

AngularJS "headers" in ng-repeat
Create an Angular filter. It can accept the sorted list, chunk it by first letter and return an object for each chunk with the letter and an array of objects that start with that letter. See for example the chunk by size filter here. Note in particular the discussion around creating hash values for your chunked values.

Categories : Javascript

AngularJS ng-repeat not working?
You are missing a call to $apply() because you are doing work outside of the angular world so try to add one line below push command and it should work angular.forEach(followers, function(follower, index){ $scope.results.push(follower); }); $scope.$apply()

Categories : Javascript

nested ng-repeat: calling a function after all the ng-repeats have been loaded
That looks pretty badass :) Try to watch the $last value in the last ng-repeat. If its true you know that reached the end. Actually I'm not sure, you might need to watch all repeats. If it so write your own ng-repeat which yields at every $last === true and watch/count the yields.

Categories : Angularjs

angularjs ng-repeat callback function
You can use ngInit directive: <span ng-repeat="item in items|myfilter"> <div ng-init="getTextFromServer({{item.id}})"></div> </span>

Categories : Javascript

Can I use ng-repeat to iterate over an array in AngularJS?
your edit is heading in the right way, you can iterate through a list of integers easily, the you just use the value of you index like that <div ng-repeat="t in [3,4,5,6,7,8]"> .... data-ng-model="modal.data.answer[t].text" ... I made a fiddle if you want to try http://jsfiddle.net/DotDotDot/tweyS/ (the input field is just here to change the selected value, as in your code sample, in order to display the right fields) have fun

Categories : Angularjs

AngularJS ng-repeat messing up with order
Solution is to use $index instead of the collection approach ('in'). <ul ng-repeat="old_news_year in news">{{old_news_year.year}} <li ng-repeat="old_news_month in old_news_year"> {{$index + 1}}. {{old_news_year[$index+1].month}} </li> </ul> Check: http://jsfiddle.net/guillaume1978/XmSTK/2/

Categories : Angularjs

AngularJS ng-repeat + SVG binding Bug in IE10?
You're re-using (and therefore, overwriting the previous version each time) the item variable because you don't create a newly scoped version of it: var demoItem = function (cnt, color) { item = {}; <-- here ... Use this instead: var demoItem = function (cnt, color) { var item = {}; ...

Categories : HTML

AngularJS SVG rendering order using ng-repeat
The problem is ng-attr-y="{{y + (item.id - 1) * (h + 6)}}" of <rect ng-repeat...>. Change it to ng-attr-y="{{y + $parent.$index * (h + 6)}}" What you want is to use the $index of the outer repeater instead of the id since the ids will get reversed. Demo

Categories : Javascript

AngularJS ng-repeat over data with # keys
Something like this? <li ng-repeat="(index, content) in GetDigestList.response.content"> <!-- ... --> </li> http://jsfiddle.net/Tdzhv/

Categories : Javascript

AngularJS add conditional class in ng-repeat
Angular repeat scope provide an $index property; therefore, you can do data-ng-class="{'grid--last': $index == 3}" assuming you mean that 4th item is 3 since index start at 0.

Categories : Javascript

ng-repeat in directive template AngularJS
This is because your directive uses a template that does not have on root element, try: <div> <h1>What?</h1> <div ng-repeat="item in items"> {{item}} </div> </div> for the template. EDIT: To understand this, we can have a look at the source of angular itself. The compile-Methods responsible for this can be looked at here. The culprit is the mergeTemplateAttributes and the need for one root becomes apparent when looking at the intent here: When replacing DOM nodes, angular needs to pass on the attributes. When there is more than one node in the template fetched it will throw an error, as it cannot decide on the node which the original attributes will be applied to (see here for the error thrown). The quote the developers here: When the

Categories : Javascript

AngularJS add CSS class on new item in ng-repeat
This should assign class the-class to the last element of the list dynamically: <li ng-class="{'the-class': $last}" ng-repeat="item in items | filter:search | orderBy:'date'"> {{ item.ID }} - {{ item.heading }} - {{ item.date | date:"dd.MM.yy" }} <button ng-click="deleteItem(item.ID)">del</button> </li>

Categories : Javascript

AngularJS Bootstrap UI btn-checkbox in ng-repeat
The answer you linked is the same solution for this problem. Each button within the repeat needs it's own unique property of the model. If they are all set to the same model, as in the plunk $scope.checkboxModel = {id: 0}, when one button is checked, they will all be checked. So to give each button uniqueness, you could set another property onto the objects within the ng-repeat. This property would hold a boolean value that changes on check. So your model would look like: $scope.companies = [{"id":2,"name":"A", truthy:false}] // and so on You would not need to explicitly set this in the controller - just declare the new property right in the button element's model: <companies ng-repeat="company in companies"> <button type="button" class="btn" ng-model="company.truthy"

Categories : Angularjs

2-way binding not working in AngularJS repeat
I'm not sure I understand the question but here is some working code that maps the first ng-repeat to records and the second ng-repeat to records2. Is this what you are trying to accomplish? The second ng-repeat was attached to mainCtrl and did not have an inc function on the scope. I set the second to use itemCtrl2 controller. <body ng-app="test1"> <div> <div ng-controller="mainCtrl"> <div ng-repeat="record in records" ng-controller="itemCtrl"> <span>{{record.val}}</span><a ng-click="inc()">inc</a> </div> <p></p> <div ng-repeat="record in records2" ng-controller="itemCtrl2"> <span>{{record}}</span><a ng-click="inc()">inc</a> &

Categories : Javascript

Angularjs: greater than filter with ng-repeat
Create the filter as a filter service using the angularjs filter api, and add minPrice as a parameter. filter('priceRangeFilter', function ( location ) { return function ( location, minPrice ) { ... } }) and in the template <div ng-repeat="m in map.markers | priceRangeFilter:minPrice"> See an example in this fiddle: http://jsfiddle.net/Zmetser/BNNSp/1/

Categories : Javascript

Angularjs ng-repeat join records
The best way to think of this is to think of how you would do this with your array data and then have your view reflect the data. So if I am understanding your question, you are trying to group the rows by the authors. I tend to use underscore.js for array manipulation ( it is very good for it) http://underscorejs.org/#groupBy It will group your data by the author. Then in your angular view, have 2 ng-repeats. the outer ng-repeat for your groups, and the inner for the message and timestamp. This will show the messages and timestamps listed for each author.

Categories : Javascript



© Copyright 2017 w3hello.com Publishing Limited. All rights reserved.