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:
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
Post a Comment