javascript - angularJS - Unable to load API Json response data into my HTML file -


here code using:

angular.module('ngapp', []) .factory('authinterceptor', authinterceptor) .constant('api', 'http://myserver.com/app/api') .controller('task', taskdata)  function taskdata($scope, $http, api) {   $http.get( api + '/tasks' ).   success(function(data) {     $scope.maintask = data;     console.log(data);   }); } 

here html file:

<html>    <head>     <title>pcc ecar app</title>      <link href="../app.css" rel="stylesheet" />   </head>    <body ng-app="ngapp" ng-controller="task" class="">      <div class="view1"> {{maintask.amount} </div>      <!-- third party scripts -->     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>      <!-- main app script -->     <script src="../app/app.js"></script>    </body> </html> 

here screenshot of console log api response:

enter image description here

what happening when go page, element view1 show {{maintask.amount}} half second , disappear leaving element blank. doing wrong. why cant load data html?

the /tasks endpoint returning array of tasks. need do:

$scope.maintask = data.tasks[0]; 

or use ng-repeat loop through tasks:

<div class="view1" ng-repeat="task in maintask.tasks"> {{task.amount}} </div> 

Comments

Popular posts from this blog

jOOQ update returning clause with Oracle -

java - Warning equals/hashCode on @Data annotation lombok with inheritance -

java - BasicPathUsageException: Cannot join to attribute of basic type -