ng-repeat не обновляет DOM, когда элемент вставляется динамически

Question

Я использую jsonForm для создания формы из 3-х различных схем JSON. Когда отправляется форма, запрашивается другая форма и так далее... Данные на всех 3 формах создают ОДИН объект json, который отправляется обратно и сохраняется после заполнения последней формы.

Формы работают должным образом, проблема заключается в обновлении списка с помощью ng-repeat

HTML:

<ul>
    <li ng-repeat="names in newName">{{names}}</li>
<ul>

Массив имен по умолчанию:

$scope.newName= ["test1","test2"];

начальный объект

var set1 = {
     "setName": "",
     "setAttributes": [],
    "setQuestions": []

};

Угловой:

        $scope.createNewSet = function () {
            $http.get('/json/schema1.json').success(function(data) {
                $('#form1').jsonForm({ // DISPLAY FIRST FORM
                 schema: data,
                 "form": [
                   "*",
                   {
                     "type": "submit",
                     "title": "Proceed to step 2"
                   }
                 ],
                 onSubmit: function (errors, values) { 
                    var sName = values.setName;
                    set1.setName = sName;
                    $http.get('/json/schema2.json').success(function(data) {
                        $('#form2').jsonForm({ //DISPLAY SECOND FORM
                        schema: data,
                        "form": [
                          "*",
                          {
                            "type": "submit",
                            "title": "Proceed to step 3"
                          }
                        ], 
                        onSubmit: function (errors, values) { // DISPLAY THIRD FORM
                            set1.setAttributes = values.attributes;
                            $http.get('/json/schema3.json').success(function(data) {
                            $('#form3').jsonForm({
                               schema: data,
                               "form": [
                                  "*",
                                 {
                                  "type": "submit",
                                  "title": "Proceed to step 4"
                                  }
                                ],
                                onSubmit: function (errors, values) { // SAVE COMPLETE SET
                                  set1.setQuestions = values.questions;
                                  $scope.newName.push(set1.setName);  //UPDATE li
                                  $scope.newName.push('blah')
                                    console.log($scope.newName);
                                },
                              });
                            });
                          },   

Консоль браузера показывает обновленный массив newName ["test1","test2","Simo","blah"] с Simo а также Blah но HTML не показывает их. Может ли быть что-то, что мешает Angular обновить DOM?

Спасибо..

Answer 1

Попробуйте повторно применить область:

$scope.$apply(function(){
    $scope.newName.push(set1.setName);  //UPDATE li
    $scope.newName.push('blah')
});