angularjs-ng-repeat

问题 Looking for a way to get AngularJS'a ng-repeat orderBy filter to do a callback once it's done rendering... Markup: <div ng-controller="MyCtrl"> <table> <thead> <tr> <th ng-click="sort('name')">Name:</th> <th ng-click="sort('age')">Age:</th> </tr> </thead> <tbody> <tr ng-repeat="item in items | orderBy:sortColumn:reverseSort"> <td>{{item.name}}</td> <td>{{item.age}}</td> </tr> </tbody> </table> </div> JS: var myApp = angular.module('myApp', []); function MyCtrl($scope) { $scope.items = [{

问题 I know object values don't have indexes but say I have an object named foo with 5 keys and I do: <div ng-repeat="(key,value) in foo"> I will end up with 5 divs on my page. My question is how do I ask Angular, "Hey, which div is this? Is it the first one? Is it the second one? Give me a number please." I can't use {{$index}} because objects don't have indexes. I can't use {{$id}} because it seems to give a number that starts from 5 and is always odd... sometimes. I just want to know where in

问题 I am trying to show a list grouped by date but the list isn't sorted and I don't know when the date change. It's like I have this Json : list = {name: first, date: 2014-05-21}, { {name: second, date: 2014-05-20}, { {name: third, date: 2014-05-21} I'd like to make the following html : <li><h3>2014-05-21</h3> <ul> <li>first</li> <li>third</li> </ul> </li> <li><h3>2014-05-20</h3> <ul> <li>second</li> </ul> </li> Do you have an idea ? I tried to make an Array of arrays with two ng-repeat like

问题 I have a situation where I want to create a directive that takes an array of items and splits them into a variable number of columns, wrapping them with elements that make the columns. After spending hours upon hours of trying various things I am stumped as how to architect this. Here is how I want to use this directive: <columnize columnCount="3" collection="items"> <div>{{item.Name}}</div> <!-- this is the repeated part --> </columnize> The directive will receive two inputs, columnCount and

问题 I have multiple JSON files: main.json: { "MainRegister": [ { "name": "Name1", "url": "url1.json", }, { "name": "Name2", "url": "url2.json", }, ] } url1.json { "SubInformation": { "description": "Hello World 1", "identifier": "id1", } } url2.json { "SubInformation": { "description": "Hello World 2", "identifier": "id2", } } Now I want to create a ng-repeat div in my index.html such that it loads all the fields from the files, moreover I want to display the following output: Name1 : Hello World

问题 I need to repeat over a deeply nested javascript object in my angular template. The problem is that I have no control over how the data is handed to me, and no way of knowing how deeply nested the data will be. The data looks like this { category_name: 'cat1' children: [ { category_name: 'cat1a', children: [...] } ] } And the template <div ng-repeat="cat in categories"> <div ng-repeat="subcat in cat.children"> {{subcat.name}} <!-- would like to programatically place an ng-repeat here too if

问题 Ok I have an object that contains a list of dates and I'm traversing it like so: <select ng-click="monthpicker()" > <option class="animate-repeat" ng-repeat="returnpicker in monthpicker(alldatesdump)" value="{{returnpicker.date}}">{{returnpicker.date | date:'yyyy-MMM' }}</option> </select> using ng-repeat this returns the following: <select ng-click="monthpicker()"> <!-- ngRepeat: returnpicker in monthpicker(alldatesdump) --> <option class="animate-repeat ng-scope ng-binding" ng-repeat=

问题 I am practicing with Angular and want to give users the option to choose from 3 dropdown select menus. The third menu should be dynamic depending on the selection from the previous two menus. My html: // First dropdown menu, static <select ng-model="selectedLetter" ng-change="setColorSelection()" ng-options="letter as letter for letter in letters"> </select> <br> // second dropdown menu, static <select ng-model="selectedNumber" ng-change="setColorSelection()" ng-options="number as number for

问题 I have a structure which looks like this: http://jsfiddle.net/deeptechtons/TKVH6/ <div> <ul ng-controller="checkboxController"> <li>Check All <input type="checkbox" ng-model="selectedAll" ng-click="checkAll()" /> </li> <li ng-repeat="item in Items"> <label>{{item.Name}} <input type="checkbox" ng-model="item.Selected" /> </label> </li> </ul> </div> angular.module("CheckAllModule", []) .controller("checkboxController", function checkboxController($scope) { $scope.Items = [{ Name: "Item one" },

问题 I've seen a lot of questions about the order in which ng-repeat finishes compared to other directives or things going on in Angular land, but I haven't been able to find an answer to how exactly it accomplishes this. I have two ideas of how it could work. First Way: When ng-repeat's watcher triggers, it removes all elements it created from the DOM then creates all new elements in their place, even if many of those elements are the same (e.g. in the case of 1 item added to the backing array).