angularjs-ng-repeat

ng-repeat with track by over multiple properties

由 匆匆过客 提交于 2019-12-17 19:57:26
问题 I have a problem with angular ng-repeat directive. Currently I work on some project where from the API I get a list of items (some times it could be 1k items) and this list should be refreshed every 5 seconds (it is monitoring related project). When the list length is a little bigger the website while re-rendering DOM could "slow". It comes out that angular regenerate the whole DOM (but 95% of item are the same ! ) One of the possible approach is to set "track by" expression for example to

Filtering nested objects in ng-repeat with a search input field

由 二次信任 提交于 2019-12-17 19:47:12
问题 I am trying to filter nested objects in ng-repeat by using a search textbox. Given the following object: $scope.items = { "1": { name: "First Item", tag: "first" }, "2": { name: "Second Item", tag: "second" } }; I want to do something like this: <input type="text" name="serchBox" ng-model="searchByName"> <p ng-repeat="(key, values) in items | filter:{name: searchByName}"> Using both {{key}} and {{values.name}} </p> This is indeed not working. I tried a lot of things and I couldn't make it

Modifying objects within Angular Scope inside ng-repeat

由 微笑、不失礼 提交于 2019-12-17 19:24:40
问题 I'm creating a form in HTML using ng-repeat to generate the form elements from an object in the scope. I also use that object to generate other elements outside of the ng-repeat. A simplified example looks like this in HTML: <div ng-app="App"> <div ng-controller="Ctrl"> <div class="block1"> <form ng-repeat="(key, value) in test"> <label>{{key}}</label> <input ng-model="value" /> <p>{{value}}</p> </form> </div> <div class="block2"> <p> {{test.a}} </p> <p> {{test.b}} </p> </div> </div> </div>

Create Row every after 2 item in Angular ng-repeat - Ionic Grid

由 ぃ、小莉子 提交于 2019-12-17 19:07:05
问题 I need to create a strcuture as below in my app through ng-repeat. <div class="row"> <div class="col-50">1</div> <div class="col-50">2</div> </div> <div class="row"> <div class="col-50">3</div> <div class="col-50">4</div> </div> Right now my code is as below: <div class="row"> <label class="item item-radio col col-50" ng-repeat="a in question.answer"> <input type="radio" name="answers" class="a-{{ a.correct }}" value="{{ a.correct }}" ng-click='ansValue("{{ a.correct }}")'> <div class="item

What is the difference between `value` attribute and `ng-value` attributes in angularjs

由 删除回忆录丶 提交于 2019-12-17 18:28:57
问题 What is the difference between value and ng-value attributes in angularjs templates? If I use ng-if on the field using value attribute it works properly but if I change the attribute value to ng-value it stops working. example 1 // it works <input type='radio' ng-model='difficulty' value='hard'/> <div ng-if="difficulty == 'hard'"> <p>difficulty is hard</p> </div> Example 2 // it doesn't work <input type='radio' ng-model='level' ng-value='hard'/> <div ng-if= "level == 'hard'" > <p>level is

AngularJS: ng-repeat with dynamic list, without rebuilding entire DOM tree?

由 China☆狼群 提交于 2019-12-17 18:12:18
问题 I'm using ng-repeat on a table row with data from a JSON array retrieved from a server. My goal is to have the list update automatically whenever an item is added, removed, or modified on the server, without affecting the unmodified items. In the final implementation, these table rows will also contain bidirectionally bound <input> and <select> elements to send updates back to the server. Some of the available options in the <select> elements will also be generated using ng-repeat directives

Automatic Serial Nos in ng-Repeat (Angular)

由 人盡茶涼 提交于 2019-12-17 17:12:21
问题 I am using ng-Repeat to fill the table with data in Controller (or from Services). However, I need to fullfill Serial Nos in first column automatically. Currently I am getting only static data as 1 in all columns. HTML: <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> </head> <body ng-app="myApp" ng-controller="myCtrl"> <table> <tr><th>S.No.</th><th>Name</th></tr> <tr ng-repeat="x in People"><td>1</td><td>{{x.name}}</td></tr> </table>

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

由 六眼飞鱼酱① 提交于 2019-12-17 16:28:06
问题 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 } });

Manipulating inline style with angular does not work in IE

由 江枫思渺然 提交于 2019-12-17 16:25:31
问题 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];

Angular passing scope to ng-include

由 孤者浪人 提交于 2019-12-17 15:39:48
问题 I have a controller that I wrote that I use in multiple places in my app with ng-include and ng-repeat , like this: <div ng-repeat="item in items" ng-include="'item.html'" ng-controller="ItemController" ></div> In the controller/template, I expect the item value to exist, and the whole thing is built around this idea. Now, though, I need to use the controller in a slightly different way, without the ng-repeat , but still need to be able to pass in an item . I saw ng-init and thought it could
订阅 angularjs-ng-repeat