Call angular function inside ng-repeat and return array

Question

I searched for this but I did not get any answer as I want, please give me a solution, I want to use ng-init inside ng-repeat, ng-init should give me different response at every loop here is my HTML

<html> <body ng-app="crmApp"> <div ng-controller="customerDetailController"> <div ng-repeat="clientDetail in client"> <p>{{clientDetail.name}}</p> <div ng-init="seoDetails = getCustDetail(clientDetail.name)"> <p>{{seoDetails.cust_Name}}</p> </div> </div> </div> </body> </html>

and my js is

<script> var crmMain = angular.module('crmApp', ['ngRoute','ngMaterial']); crmMain.controller('customerDetailController',function customerDetailController($scope, $http, customerDetailFactory,$window) { $scope.client = []; $scope.init = function () { $scope.getCustomerData(); }; $scope.getCustomerData = function () { customerDetailFactory.getCustomerDetailData().then(function (response) { $scope.client = response.data; }); }; $scope.getCustDetail = function (Name) { var custDetail = []; custDetail = customerDetailFactory.getCustomerDetailData(Name).then(function (response) { alert(response.data.cust_Name); return response.data; }); return custDetail; }; $scope.init(); }); crmMain.factory('customerDetailFactory', ['$http', function ($http) { var factory = {}; var url = 'phpFile/customerDetail.php'; factory.getCustomerDetailData = function (Name) { return $http({ method: 'POST', url: url, data: { 'functionName': 'clientDetailPage', 'customerName': Name } }); }; return factory; }]); </script>

In inside getCustDetail function I was given alert in there it 'll show name, but I don't know why it not showing in HTML.is anything wrong I did?

I have got one solution for this, I think I have to use Promises for this, but I don't know how to use it can anyone help me in this?

Check the docs, there are very few times where you should use ng-init. docs.angularjs.org/api/ng/directive/ngInit — Phix, CommentedDec 14, 2017 at 6:38
ya, I used ng-init inside of the ng-repeat property, is there any problem? — Deekshith S, CommentedDec 14, 2017 at 7:17

Aswath K · Accepted Answer · 2017-12-14 08:28:14Z

You cannot use ng-init for this purpose. You've to do the data fetching inside the controller itself. That is like,

customerDetailFactory.getCustomerDetailData() .then(function(response) { $scope.client = response.data; // for each clients, fetch 'seoDetails' $scope.client.forEach(function(client) { customerDetailFactory.getCustomerDetailData(client.name) .then(function (response) { // I hope response.data contains 'cust_Name' client.seoDetails = response.data; }) }); });

Now, in the view, you can directly use the seoDetails property

<div ng-repeat="clientDetail in client"> <p>{{clientDetail.name}}</p> <p>{{clientDetail.seoDetails.cust_Name}}</p> </div>

I have one doubt can we put array to client.seoDetails inside forEach loop? and use it using of ng-repeat? do it works? for ex: in response i return array to client.seoDetail and in HTML i use it like this <div ng-repeat="clientSEO in clientDetail.seoDetails"t><p>{{clientSEO.cust_Name}}</p></div> — Deekshith S, CommentedDec 14, 2017 at 11:33

Collectives™ on Stack Overflow

Call angular function inside ng-repeat and return array

1 Answer 1

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Related