Angular data binding issue

Question

<body ng-app="myAPP">
<div ng-controller="employeeCtrl"> 
    <table style="border:1px solid gray">
        <tr>
            <th>Employee Name</th>
            <th>Employee Address</th>
            <th>Employee Salary</th>
        </tr>
        <tr ng-repeat="emp in employees">
            <td>
                {{emp.EmployeeName}}
            </td>
            <td>
                {{emp.EmployeeAddress}}
            </td>
            <td>
                {{emp.EmployeeSalary}}
            </td>
        </tr>
    </table>
</div>

var myAPP = angular.module('myAPP', []);

myAPP.controller('employeeCtrl', function ($scope, $http) {    
    $scope.employees = "";
    $http({
        method: 'GET',
        url: '/Employee/GetEmployee'
    }).then(function (result) {
        $scope.employees = result;
    }, function (result) {
        console.log(result);
    }); 
});

using angular 1.6.6 version data binding is not working though it returns results from http get method.

add your controller code also

Syedur
– Syedur

2017-12-02 09:46:30 +00:00
Commented Dec 2, 2017 at 9:46 — Syedur
– Syedur, Commented Dec 2, 2017 at 9:46
Provide employeeCtrl inside question.

Marko Savic
– Marko Savic

2017-12-02 09:46:55 +00:00
Commented Dec 2, 2017 at 9:46 — Marko Savic
– Marko Savic, Commented Dec 2, 2017 at 9:46

Sajeetharan · Accepted Answer · 2017-12-02 10:37:08Z

1

You need to access the data property of the response, change your controller method as follows, and $scope.employees is an array not a string,

var myAPP = angular.module('myAPP', []);

myAPP.controller('employeeCtrl', function ($scope, $http) {    
    $scope.employees = [];
    $http({
        method: 'GET',
        url: '/Employee/GetEmployee'
    }).then(function (result) {
        $scope.employees = result.data;
    }, function (result) {
        console.log(result);
    }); 
});

answered Dec 2, 2017 at 10:37

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

JB Nizet · Accepted Answer · 2017-12-02 10:37:09Z

0

You're trying to iterate through a string. It should be

$scope.employees = [];

or

$scope.employees = null;

but not an empty string.

And later employees becomes an HTTP response. Once again something that you can't iterate on. If the body of the response is indeed an array, then it should be

$scope.employees = result.data;

answered Dec 2, 2017 at 10:37

JB Nizet

694k94 gold badges1.3k silver badges1.3k bronze badges

Collectives™ on Stack Overflow

Angular data binding issue

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related