Make an AJAX request using $http to fetch data from an external API and display it on the page using angular js.

<div ng-app="ajaxApp" ng-controller="AjaxController">
    <ul>
        <li ng-repeat="post in posts">{{ post.title }}</li>
    </ul>
</div>

<script>
    var app = angular.module('ajaxApp', []);
    app.controller('AjaxController', function($scope, $http) {
        $http.get('https://jsonplaceholder.typicode.com/posts')
            .then(function(response) {
                $scope.posts = response.data;
            })
            .catch(function(error) {
                console.error('Error fetching data:', error);
            });
    });
</script>

 

Post your Answer