AJAX to Angularjs Response SharePoint

Question

Can someone give me some assistance in converting this AJAX get list items to $http? Specifically I am trying to get the different fields to $scopes. I am aware that when doing $http now you can no longer use "success" and I pass in response.data but when I use angular.forEach and console.log the variables I am not getting anything in the console. I would much prefer to learn to do this the angular way without creating a service if possible.

$(document).ready(function getListItems() {

$.ajax({
    url: url + "/_api/web/lists/getByTitle('POST')/items?&$select=Post,Arena,Country,City",
    type: "GET",
    headers: { "Accept": "application/json;odata=verbose" },
    success: function (data) {
        $.each(data.d.results, function () {
        var arena = this.Arena;
            var post = this.Post;
            var city = this.City;
            var country = this.Country;
            console.log(post);
            console.log(arena);
            console.log(country)
            console.log(city)
        });
    },
    error: function (errorMsg) {
        console.log(errorMsg);
    }
});

});

Answer 1

Sample script for your reference.

var myAngApp = angular.module('myApp', []);
    myAngApp.controller('myController', function ($scope, $http) {
        $http({
            method: 'GET',
            url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('POST')/items?&$select=Post,Arena,Country,City",
            headers: { "Accept": "application/json;odata=verbose" }
        }).success(function (data, status, headers, config) {
            $scope.countries = data.d.results;
        }).error(function (data, status, headers, config) {

        });
    });

Update:

Below script works in my local.

<div ng-app="myApp" class="row">
        <div ng-controller="myController" class="span10">
            <table class="table">
                <tr>
                    <th>Title</th>                    
                </tr>
                <tr ng-repeat="country in countries">
                    <td>{{country.Title}}</td>
                </tr>
            </table>
        </div>
    </div>
    <script type="text/javascript" src="/SiteAssets/angular/angular.min.js"></script>
    <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script>
        var myAngApp = angular.module('myApp', []);
        myAngApp.controller('myController', function ($scope, $http) {
            $http({
                method: 'GET',
                url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('MyList3')/items?&$select=Title",
                headers: { "Accept": "application/json;odata=verbose" }
            }).success(function (data, status, headers, config) {
                $scope.countries = data.d.results;
            }).error(function (data, status, headers, config) {

            });
        });
    </script>