CODEWITHSUNDEEP
angularjs
Thiyagarajan
Thiyagarajan

Reputation: 325

Ng-bind is not working

I have a issue in data binding using angularjs

I am trying to bind the data from the controller view. data has been successfully received in the response. i have assigned it in the datalist. while trying to loop the datalist using ng-repeat and ng-bind i cannot able to view. seems ng-repeat is working i can able to see the index looping successfully. Kindly help on this issue.

Html

        <tbody>
        <tr ng-repeat="data in dataList">
            <td>{{$index+1}}</td>
            <td ng-bind="data.Name"></td>
            <td ng-bind="data.Email"></td>
            <td ng-bind="data.Phone"></td>
        </tr>
    </tbody>

Angular Js

      var myApp = angular.module('myModule', []);
      myApp.controller('myController', function ($scope, $http) {
      $scope.dataList = [];
      $http.get('/Home/JsonValue').then(function (response) {
      if (response != null || response != "undefined") {
        $scope.dataList = response;
    }
})
  });

Json Data

   Data: Array(5)
      0:{Name: "Pramod", Email: "[email protected]", Phone: "987654321"}
      1:{Name: "Prem", Email: "[email protected]", Phone: "123456789"}
      2:{Name: "Ram", Email: "[email protected]", Phone: "9811234343"}
      3:{Name: "Shyam", Email: "[email protected]", Phone: "9889657454"}
      4:{Name: "Jitesh", Email: "[email protected]", Phone: "9535468899"}

Upvotes: 0

Views: 88

Answers (3)

Nathash
Nathash

Reputation: 61

Try by updating your JSON structure as follow,

[
  {"Name":"Pramod", "Email": "[email protected]"}
]

(save it in json file and call that file using $http.get() method)

Upvotes: 0

kapishreshth
kapishreshth

Reputation: 4098

I'm writing this answer just to correct your json format. Though Sajeetharan's answer is correct but If your json is not in correct format, @Thiyagarajan your code won't display the json data even If you use response.data. Hence I have created an example for your problem.

var myApp = angular.module('myModule', []);
myApp.controller('myController', function ($scope) {
    $scope.dataList = [
                {Name: "Pramod", Email: "[email protected]", Phone: "987654321"},
                {Name: "Prem", Email: "[email protected]", Phone: "123456789"},
                {Name: "Ram", Email: "[email protected]", Phone: "9811234343"},
                {Name: "Shyam", Email: "[email protected]", Phone: "9889657454"},
                {Name: "Jitesh", Email: "[email protected]", Phone: "9535468899"}
      ];
});

Thanks!!!

Upvotes: 0

Sajeetharan
Sajeetharan

Reputation: 222522

You should access the data property of response

 $http.get('/Home/JsonValue').then(function (response) {
      if (response != null || response != "undefined") {
        $scope.dataList = response.data;
 }

Upvotes: 1

Related Questions