angularjs-ng-repeat

ng-repeat in combination with custom directive

隐身守侯 提交于 2019-11-27 03:11:12
问题 I'm having an issue with using the ng-repeat directive in combination with my own custom directive. HTML: <div ng-app="myApp"> <x-template-field x-ng-repeat="field in ['title', 'body']" /> </div> JS: angular.module('myApp', []) .directive('templateField', function () { return { restrict: 'E', compile: function(element, attrs, transcludeFn) { element.replaceWith('<input type="text" />'); } }; }); See jSFiddle The problem here is that nothing is replaced. What I'm trying to accomplish is an

filter data using dropdown?

。_饼干妹妹 提交于 2019-11-27 02:50:21
问题 I have an array of objects which are just items. I also have a dropdown which I would like to use to allow the user to filter by price or rating however on page load there should be no filtering. How do I map item data to filter based on the current select option? I have a plunkr to get started: LINK 回答1: First and foremost, your select values are ambiguous. They contain values that can filter AND sort the entries - Separate the two since they are two different functionality. Next, you need

Using comma as list separator with AngularJS

社会主义新天地 提交于 2019-11-27 02:42:16
I need to create a comma-separated list of items: <li ng-repeat="friend in friends"> <b ng-repeat="email in friend.email">{{email}}{{$last ? '' : ', '}}</b>... </li> According to the AngularJS documentation, no control flow statements is allowed in expressions. This is why my {{$last ? '' : ', '}} does not work. Is there an alternative way to create comma-separated lists? EDIT 1 is there something simpler than: <span ng-show="!$last">, </span> You could do it this way: <b ng-repeat="email in friend.email">{{email}}{{$last ? '' : ', '}}</b> ..But I like Philipp's answer :-) Just use Javascript

Using ng-repeat and limitTo to limit the number of visible items displayed

梦想与她 提交于 2019-11-27 02:29:26
问题 I'm trying to limit my result sets to a fixed number. I can use limitTo with ng-repeat , but this limits items regardless of their current visibility and removes items from the DOM. I want to limit to a number of visible items while keeping everything in the DOM. Here is the current code that I have. My goal is to always show no more than 50 items in the list even though items contains 500 items. <div ng-repeat="item in items | limitTo: 50"> <div ng-show="item.visible"> <p>item.id</p> </div>

Angular orderBy number sorting as text in ng-repeat

会有一股神秘感。 提交于 2019-11-27 01:48:38
I have this data: [{"id":"42","firstname":"Sarah","lastname":"Dilby","age":"40","cars":"Yaris"}, {"firstname":"Jason","lastname":"Diry","age":"5","id":"5"}, {"id":"6","firstname":"Bilson","lastname":"Berby","age":"1","cars":"Tipo"}] When I orderBy id or by age in an ng-repeat, it sorts the number as text. Since I can't find it written that this is an issue anywhere, I'm guessing there's a problem with my code. I have created this fiddle: http://jsfiddle.net/vsbGH/1/ Sorry about the template, but jsfiddle doesn't allow in the html box. Anyway, this is the code which loads and sorts the data: /

Using ng-repeat and ng-class on rows inside a table

最后都变了- 提交于 2019-11-27 01:26:34
问题 I am using AngularJS and the effect I want to get would be something similar to what this would produce, assuming it would work (which it doesn't). View <tr ng-repeat='person in people' ng-class='rowClass(person)'> <td>.....info about person...</td> <td>.....info about person...</td> <td>.....info about person...</td> </tr> Controller $scope.rowClass = function(person){ ...return some value based upon some property of person... } I realise that this code won't work because person is

AngularJS using $sce.trustAsHtml with ng-repeat

十年热恋 提交于 2019-11-27 01:23:04
问题 I'm trying to use $sce.trustAsHtml() with a property of an object in ng-repeat. The result is that the HTML is totally blank. The HTML outputs correctly using ngSanitize though. <div ng-repeat="question in questions"> <p ng-bind-html="$sce.trustAsHtml(question.body)"> </p> </div> I'm on AngularJS v1.3.0-beta.3 by the way. Not sure if there's a bug or I do something wrong. 回答1: You can't use $sce.trustAsHtml in an expression (unless $sce is a property on the $scope ) because expressions are

Angular JS filter not equals

穿精又带淫゛_ 提交于 2019-11-27 01:17:10
问题 Seems like a very basic question but I can't get the syntax right.. <li class="list-group-item" ng-repeat="question in newSection.Questions | filter:Id != '-1'; " ng-mouseenter="hover = true" ng-mouseleave="hover = false"> <div href="#" editable-text="question.Text">{{question.Text}}</div> </li> All I want is to show all the questions where id is NOT -1. What am I doing wrong. Thanks! 回答1: The syntax is just a little off, try: <li class="list-group-item" ng-repeat="question in newSection

AngularJS ng-repeat with custom element inside a table is rendering strangely

夙愿已清 提交于 2019-11-27 00:44:06
问题 I'm trying to re-use a portion of my HTML view in multiple places. The portion I want to re-use is table cells in an HTML table. The problem is that my custom directive inside a ng-repeat is doing funny things. I have reproduced the problem on jsFiddle. There are two HTML tables in the jsFiddle. The first is ng-repeat with the table cells written in the view and the second is the table cells coming from a directive, my-element. Chrome dev tools report that the rendered HTML looks like this.

Angular ng-change delay

浪子不回头ぞ 提交于 2019-11-27 00:32:34
问题 I have an input which filters a ng-repeat list on change. The repeat contains a lot of data and takes a few seconds to filter through everything. I would like their to be 0.5 second delay before I start the filtering process. What is the correct way in angular to create this delay? Input <input ng-model="xyz" ng-change="FilterByName()" /> Repeat <div ng-repeat"foo in bar"> <p>{{foo.bar}}</p> </div> Filter Function $scope.FilterByName = function () { //Filtering Stuff Here }); Thanks 回答1: