Search Posts

Category: angularjs-ng-repeat

ng-click on img not working inside ng-repeat

In my view I have a list of icons that when clicked, should call a function from the controller. View <div ng-controller=”EditorController” class=”main-div”> <aside> <div ng-repeat=”icon in EditorIcons”> <img ng-click=”changeme()” data-ng-src=”{{icon.source}}” alt=”{{icon.name}}”/> </div> </aside> </div> Controller app.controller(‘EditorController’, function($scope) { $scope.EditorIcons = [ … ]; $scope.changeme = function() { console.log(“changing”); } } I’ve seen this question asked before, yet I still wasn’t able to find out the problem here. What am I doing wrong? UPDATE I’ve […]

Angularjs, select Box create blank option at first always

I got some problems with selectbox. In my original code, I receive an object through $http calling, and that is like below. [ {key:’user_id’, value:’ID’}, {key:’user_name’, value:’Name’}, {key:’user_gender’, value:’Gender’}, {key:’user_phone’, value:’Phone’}, {key:’user_email’, value:’Email’}, {key:’user_birth’, value:’Birthday’}, ]; When I tried to put values of this object into option, it made ‘blank option’ automatically. To solve this, I saw two posts Angular JS Remove Blank option from Select Option Why does AngularJS include an empty option in […]

angularjs and jquery conflict cause chrome stop responsing

<div class=”gridly-static”> <div id={{y.id}} ng-repeat=”y in Categories” ng-init=”initCategories()”> <div class=”title”>{{y.name}}</div> </div> </div> Categories variable is fetched from api service via $http.get(),and ng-init call initCategories is to reset the layout dynamically using jquery-gridly.The combination of two things make my chrome stop responding(The tab also can’t close at all) When I change the Categories to a object(don’t fetch from internet), the code works find. Also, When I don’t init the layout using $(‘xxx’).gridly(), it works too. I […]

Change to parent component array with ngRepeat doesn’t trigger child $onChanges

I’m working with parent and child components. The child-component is one-way data bound (‘<‘) to a value that comes via an ng-repeat over an array in the parent component. <li ng-repeat=”item in $ctrl.items”> <child-component item=”item”></child-component> </li> And the component: var childComponent = { bindings: { item: ‘<‘ }, controller: ‘ChildComponentController’, template: ‘<div>{{ $ctrl.item.name }}</div>’ } Perhaps I’ve misunderstood how $onChanges is supposed to work, but it seems like updating an item in the parent controller’s […]

AngularJS improve ng-repeat performance with out pagination

I’m getting around 1000 records from API. I want to show in the UI without pagination(We are having some other issues at this moment). I’m loading those records in the html using ng-repeat. ng-repeat is taking lot of time for rendering those page.I’m using ‘track by id’ also. How can I improve ng-repeat performance? What are my options? Source: AngularJS

ng-repeat Return empty rows

I tried with below code, but it is returning an empty row (more than 30+) of the table. json [ {“COMPANY_ID”:”1″,”COMPANY_DESC”:”11″,”COMPANY_CURRENCY”:”1″,”ACTIVE”:true,”IS_HEADOFFICE”:true,”ACCOUNTING_SYSTEM_ID”:”1″}, {“COMPANY_ID”:”2″,”COMPANY_DESC”:”2″,”COMPANY_CURRENCY”:”22″,”ACTIVE”:false,”IS_HEADOFFICE”:false,”ACCOUNTING_SYSTEM_ID”:”1″} ] Html <tr ng-repeat = “company in companies track by $index””> <td>{{ company.COMPANY_ID }}</td> <td>{{ company.COMPANY_DESC }}</td> <td>{{ company.COMPANY_CURRENCY }}</td> </tr> App <script> var app = angular.module(‘myApp’, []); app.controller(‘customersCtrl’, function($scope, $http) { $http.get(“http://localhost:52087/api/accountmapping”) .success(function (response){ $scope.companies = angular.fromJson(response); console.log(angular.fromJson(response)); }); }); </script> Source: AngularJS

AngularJS – ui-routing with ng-click not working properly

I’m using ui-router for creating some routes and I’m getting this very weird thing happening. I have this route config .state(‘chapter_route’, { url: ‘/book/:chap’, templateUrl: “views/chapter.html”, params: { chap: null} }) So when I clink on: <a ui-sref=”chapter_route({ chap: getChapter.title})”>CHAPTER:</a> It redirects me, as I wanted, to this following ui-view: <div class=”panel panel-default”> <div class=”panel-body”> <p>{{getChapter.title}}</p> {{getChapter.content}} </div> </div> …… …… <div class=”panel panel-default” data-ng-repeat=”cha in allChapters”> <div class=”panel-body”> <a ui-sref=”chapter_route({ chap: cha.title})” ng-click=”changeChapter(chap)”>{{cha.title}}</a> {{cha.content […]

How to get two json value from one ngrepeat?

I want to get two JSON array value in one ngrepeat. var app = angular.module(‘testApp’,[]); app.controller(‘testCtrl’,function($scope){ $scope.res ={}; $scope.res.fsus = [ { “statusMessageType”: { “MasterConsignment”: { “ReportedStatus”: { “ReasonCode”: “var” }, “time”: { “timeA”: “2017-10-01T10:15:00.000Z” } } } }, { “statusMessageType”: { “MasterConsignment”: { “ReportedStatus”: { “ReasonCode”: “car” }, “time”: { “timeA”: “2017-10-01T10:15:00.000Z” } } } }, { “statusMessageType”: { “MasterConsignment”: { “ReportedStatus”: { “ReasonCode”: “car” } } } }, { “statusMessageType”: { “MasterConsignment”: { […]

slow loading of angular datatable with large data with ng-repeat

I am dealing with a project contains angular datatable . Problem with this data table it contains about 2500 rows to display. it is taking nearly 1 min to load. pagination is also applyed it contains 500 pages each page display 5 rows based on filtering .i have tried vs-repeat and limti to filter but no luck. i cant apply server side procesing because i am getting ajax error .Any help? please Source: AngularJS

Next Page »