Why are added elements to array not showing (angularJs + ajax)?

Question

Angular

I have an array of strings which is rendered as a list using angular, but I can't add a string to it with the success function of an ajax request. When adding from a normal function, everything is added normally.
Controller code:

function directoryController($scope) {
    function initialize() {
        $.ajax({
            url: '/api/directory/',
            type: 'GET',
            dataType: 'json',
            success: function (data) {
                for (var i = 0; i < data.length; i++) {
                    alert(data[i].Name);
                    $scope.directories.push(data[i].Name); //Эти элементы не добавляются
                }
            },
            error: function (x, y, z) {
                alert(x + '\n' + y + '\n' + z);
            }
        });
    }

    function test() {
        $scope.directories.push("test"); //этот элемент добавлен успешно
    }
    $scope.currentDir = "";
    $scope.directories = ["..."];

    test();
    initialize();
}

Markup:

<p class="currentDirectory"><span>Current directory: </span>{{currentDir == "" ? '[ROOT]' : currentDir}}</p>
    <span ng-model="currentDir"></span>
    <ul>
        <li ng-repeat="obj in directories">
            <p>{{obj}}</p>
        </li>
    </ul>

Result:

Answer 1

Why isn't it used?
$http.get('...').success(function(response){})