Why doesn't AngularJs render the list given by $resource?

Question

Angular

There is a test directive that renders a list using ng-repeat

filterApp.directive('test', function(){
     return {
        restrict: 'E',
        //require: '^ngModel',
        scope: {
            items: '='
        },
        template: "<select><option ng-repeat='item in items'>{{item.name}}</option></select>",
        link: function($scope, $element, $attrs) {
            
        }
     }
})

Template
<test items="countryItems"></test>
There is a controller that fills the countryItems variable by making a request to the REST service:
$scope.countryItems = Countries.query();
The output is an empty list.
AngularJs has a built-in mechanism that makes it easy to work with asynchronous tasks. In this case, it fills $scope.countryItems with an empty array, and as soon as the data arrives, it fills the array with them.
Theoretically, after filling the array with data, the angular should catch this change and send it to all subscribers, i.e. re-render the list. But that doesn't happen.
Moreover, if you write in the link function:

$scope.$watch('items', function(v) {
                console.log(v);
            }, true);

It can be seen that the updated array still reaches the directive itself, but the view is not redrawn.
What am I doing wrong?

Answer 1

Everything works plnkr.co/edit/WFHMFMnqKM2MmCQ6tcNx See elsewhere