Angular область действия контроллера не обновляется после вызова jQuery ajax

У меня есть этот код, и я не вижу, где источник проблемы, я не получаю никаких ошибок в консоли Chrome мой контроллер:

function notifController($scope) {
  $scope.refreshMsgs = function () {
    $.post("notification-center-trait.aspx")
      .success(function (data) {
        $("#loadedthings").html(data);
        newMsgs = JSON.parse($("#label1").html());
        $scope.msgs = newMsgs;
      });
  }
  $scope.refreshMsgs();
}

label1 и label2 загружаются правильно внутри div файлов;

newMsgs в консоли анализируется так, как должно;

У меня он работал на других страницах, но кажется, что я что-то пропустил на этом one.i есть тег <html ng-app>:

<div ng-controller="notifController"> 
    <div class="row">
    {{msgs.length}} new msgs : 
              <table class="table">
                  <tbody >
                      <tr ng-repeat="msg in msgs">
                        <td>
                            {{msg.sender}}
                        </td>
                        <td>
                            {{msg.message}}
                        </td>
                        <td>
                            {{msg.date}}
                        </td>
                      </tr>
                  </tbody>
              </table>
</div>
</div>

i get 'undefined' в консоли, когда я выполняю это: angular.element($0).scope()

Ответ 1

Невзирая на другие архитектурные проблемы, которые я указал в комментариях, реальная проблема заключается в том, что вы используете jQuery ajax вместо Angular $http. Если вы не делаете этого с помощью Angular, вы работаете вне области Angular, и он не знает об изменениях. Хотя это не идеально, вы можете использовать $scope.$apply, чтобы Angular знал, что что-то обновлено вне его знаний. Это будет выглядеть так:

$scope.$apply(function() {
  $scope.msgs = newMsgs;
});

Это говорит Angular, что вы изменили что-то, о чем ему нужно знать, из контекста, о котором он не знает (jQuery ajax-вызов в этом случае).

Существуют некоторые допустимые применения $scope.$apply(), например, в обработчиках событий, но чаще всего это признак плохой практики. Вы должны использовать Angular $http для вызовов ajax.