Заполнение $scope с помощью .getJSON()

Я начал играть с Angular.js в последнее время и получил демонстрационный проект, который работает очень хорошо. Однако, когда я попытался загрузить данные из веб-службы бэкэнда по сравнению с жестким кодированным массивом, я начал повесить трубку. В частности, страница не кажется должным образом привязана к данным после того, как я установил $scope, используя $.getJSON(). Done (...). Вместо того, чтобы просто присваивать значение $scope после завершения .getJSON, должен ли я делать это где-то еще/по-другому? Я искал высоко и низко и на самом деле не мог найти хороших примеров angular, которые вытаскивают исходные данные из бэкэнд.

Заранее благодарим за помощь!

Ответ 1

Поскольку вы пытаетесь обновить $scope вне Angular, вам придется внести изменения в свою модель с помощью $apply метод в области.

Может быть что-то вроде:

    $.getJSON('ajax/test.json', function(data) {
        $scope.$apply(function(){
            $scope.modelData = data;
        });
    });

Предпочтительным способом доступа к бэкэнд с помощью AngularJS будет использование $http или $resource вместо jQuery. Вам не нужно будет использовать $scope.$apply, вы можете просто обновить свой $scope.modelData напрямую.

Этот пост имеет хороший fiddle обновление модели за пределами Angular кода.

Ответ 2

или вместо обертывания с применением, просто вызовите его в конце функции обратного вызова, например

  $.getJSON('ajax/test.json', function(data) {
    $scope.data = data;        
    $scope.$apply();
});