angularjs-ng-repeat | 易学教程

AngularJS - Set default value on select inside a ng-repeat [duplicate]

阅读更多关于 AngularJS - Set default value on select inside a ng-repeat [duplicate]

问题 This question already has an answer here: AngularJS. When select have ng-model attribute, ng-selected not working 2 answers I'm facing to an issue with AngularJS - I'm not able to display the selected value in a <select> . Here is my use case: I have a view which starts by an ng-repeat to display components. Each component contains a select to choose the vat rate. When creating new items, it looks fine. But when I'm editing existing items, the actual vatRate code is not displayed in the

angularjs - how to get in the controller the index of an item in a ng-repeat filter based on the value of one of its properties?

阅读更多关于 angularjs - how to get in the controller the index of an item in a ng-repeat filter based on the value of one of its properties?

I use a ng-repeat in my html file to display filtered items: <li ng-repeat="item in (filteredItems = (items | filter:query))"> {{ item.name }} </a> In the controller, I'd like to get the index of an item based on one of his property. Precision: I'd like to get the index in the filtered list and not in the whole list. Here for example, it will be the index of the item witch name is some_item_7 . var app = angular.module('myApp', []); app.controller('MyCtrl', ['$scope', function MyCtrl($scope) { $scope.query = 'some'; $scope.items = [ { name: 'some_item_1' }, { name: 'another_item_2' }, { name:

ngRepeat:dupes - duplicates in repeater with nested ngrepeat and empty strings

阅读更多关于 ngRepeat:dupes - duplicates in repeater with nested ngrepeat and empty strings

I'm working with angular building a table of data which comes from a JSON API call. I'm having to use a nested ngRepeat however I'm seeing strange results where whole table rows are missing when the row has a couple empty strings. I can reproduce with the following plunk. http://plnkr.co/edit/VCzzzPzfgJ95HmC2f83P?p=preview <script> function MyController($scope){ $scope.test = {"rows":[ ["one","two","three"], ["one","two","three"], ["one","","three"], ["one","",""], ["","two",""], ["","","three"], ["one","two","three"], ["one","two","three"], ]};}; </script> <div ng-app ng-controller=

ng-repeat unknown number of nested elements

阅读更多关于 ng-repeat unknown number of nested elements

I'm wondering if there is a simple solution to this type of problem. I have an object comment, which can in turn contain comments, and those comments can also contain comments ...and this can go on for a unknown number of cycles. Here is an example of the data structure: var comment = { text : "", comments: [ { text: "", comments : []}, { text: "", comments: [ { text: "", comments : []}, { text: "", comments : []} { text: "", comments : []} ]} ] } Lets say for 2 levels of comments I would write: <div ng-repeat="comment in comments"> {{comment.text}} <div ng-repeat="comment in comments"> {

Angularjs $resource not working with an array returned from a REST API

阅读更多关于 Angularjs $resource not working with an array returned from a REST API

I am trying to learn angularjs, and have hit a block in trying to databind to an array returned from a Rest API. I have a simple azure api returning an array of person objects. Service url is http://testv1.cloudapp.net/test.svc/persons . My controller code looks like: angular.module("ToDoApp", ["ngResource"]); function TodoCtrl($scope, $resource) { $scope.svc = $resource('http://testv1.cloudapp.net/test.svc/persons', { callback: 'JSON_CALLBACK' }, { get: { method: 'JSONP', isArray: true } }); $scope.items = $scope.svc.get(); $scope.msg = "Hello World"; } My html looks like: <html> <head></head

Manipulating inline style with angular does not work in IE

阅读更多关于 Manipulating inline style with angular does not work in IE

I wanted to set the position of a div based on the return value of a function in an angular controller The following works fine in FireFox and in chrome but in Internet explorer {{position($index)}}% is interpreted as a literal string value and therefore has no effect <div ng-repeat="item in items" style="left:{{position($index)}}%"></div> Here is an example of the issue: var app = angular.module('app', []); app.controller('controller', function($scope) { $scope.items=[1,2,3,4,5,6,7,8,9,10]; $scope.position=function(i){ var percent =[5,10,15,20,25,30,35,40,45,50,55,60,65,70]; return percent[i

Angular list with ng-repeat with date as divider

阅读更多关于 Angular list with ng-repeat with date as divider

问题 I've got a JSON object with different events that looks like this: { "error":false, "events":[ { "id":1, "title":"First entry", "date":"2014-11-04" }, { "id":2, "title":"Second entry", "date":"2014-11-04" }, { "id":3, "title":"Third entry", "date":"2014-11-05" }, { "id":4, "title":"Fourth entry", "date":"2014-11-06" }, { "id":5, "title":"Fifth entry", "date":"2014-11-06" } ] } This object is stored in $scope.events in my controller. Now I'm looping this array to build the list of events: <ion

Recursion with ng-repeat in Angular

阅读更多关于 Recursion with ng-repeat in Angular

问题 I have the following data structure for items in my sidemenu, in an Angular app based on a paid-for web site theme. The data structure is my own, and the menu is derived from the original menu view with all items in the ul hard coded. In SidebarController.js : $scope.menuItems = [ { "isNavItem": true, "href": "#/dashboard.html", "text": "Dashboard" }, { "isNavItem": true, "href": "javascript:;", "text": "AngularJS Features", "subItems": [ { "href": "#/ui_bootstrap.html", "text": " UI

Does ngRepeat exist in Angular 2?

阅读更多关于 Does ngRepeat exist in Angular 2?

I've read various issue tracker entries in relation to Angular 2 and its implementation of ng-repeat, but as it stands I haven't actually worked out if it actually exists yet. Is it possible to use ng-repeat in angular 2? Angular 2.0 Release my-component.ts: import { Component } from 'angular2/core'; @Component({ selector: 'my-component', templateUrl: './my-component.html' }) export class MyComponent{ public values: number[] = [1, 2, 3]; } my-component.html: <div *ngFor='let value of values; trackBy: index;'> {{ value }} </div> From alpha 28 to 30 it's the following syntax: import { NgFor }

Do bindings nested inside of a lazy one-time ng-repeat binding bind just once?

阅读更多关于 Do bindings nested inside of a lazy one-time ng-repeat binding bind just once?

问题 My understand is that in the following code, both bindings will lazily bind only once : <li ng-repeat="item in ::items">{{::item.name}}</li> However, in the following case will {{item.name}} be updated every digest? <li ng-repeat="item in ::items">{{item.name}}</li> And how does one-time binding effect nested ng-repeat s ? <li ng-repeat="item in ::items"> <span ng-repeat="thing in item.things">{{thing.name}}</span> </li> 回答1: Scenario 1: <li ng-repeat="item in ::items">{{::item.name}}</li>