Javascript Ng在数组更新后重复不更新

我有一个数组，其中包含模板中的卡片对象，以便循环。如果它检测到本地数据存储中没有任何内容，它将创建一个包含对象的数组。否则，它将从本地数据存储中检索它。按下按钮将使您进入共享同一控制器的另一个视图。有一个文本框，如果按submit按钮，它会将其拼接到阵列。如果检测到更改，我还有一个监视函数来更新本地数据存储

问题是在向数组添加某些内容后，ng repeat不会更新。如果我只因为本地数据存储加载而刷新页面，则会发生错误

有什么想法吗

代码：controllers.js

.controller('NotesCtrl', function($scope, localStorageService) {
if (!localStorageService.get("agendaNotes")) {
    $scope.notes = [{
        title: "Civil War Notes"
    }, {
        title: "Types of Bacon"
    }];
    //If it exists retrieve it from keystore.
} else {
    $scope.notes = localStorageService.get("agendaNotes");
}

$scope.addNote = function(title) {
    $scope.notes.splice(0, 0, {
        title: title
    })
};

$scope.$watch("notes", function(newVal, oldVal) {
    if (newVal !== null && angular.isDefined(newVal) && newVal !== oldVal) {
        localStorageService.add("agendaNotes", angular.toJson(newVal));
    }
}, true);

})

tab.notes.html

<ion-view view-title="Notes">
  <ion-content class="padding" ng-init="init()">
    <!-- To Do List for Notes:

    - Store Text in Object
    - Phonegap Camera API
    - Store Image in Object
    -->

    <a class="button button-full button-royal" href="#/tab/new">
      Add Notecard
    </a>

    <div class="card" ng-repeat="note in notes track by $index">
  <div class="item item-divider">
    {{note.title}}
  </div>
  <div class="item item-text-wrap">
    {{note.content}}  </div>
</div>
  </ion-content>
</ion-view>

{{note.title}
{{note.content}

new-note.html

<ion-view view-title="New Note">
    <ion-content>
        <!-- To Do:
      - Description
      - Images (?)
      -->
        <form ng-submit="addNote(data.newTitle, data.newDescription); data.newTitle = ''; data.newDescription = ''">
            <div class="list">
                <div class="list list-inset">
                    <h3>Note Title:</h1>
                    <label class="item item-input">
                        <input type="text" placeholder="Title" ng-model="data.newTitle">
                    </label>
                  <h3>Note Description:</h3>
                    <label class="item item-input">
                        <input type="text" placeholder="Description" ng-model="data.newDescription">
                    </label>
                </div>
                <button class="button button-block button-positive" type="submit">
                    Add Note
                </button>
            </div>
        </form>
    </ion-content>
</ion-view>

附注标题：
注：说明：
添加注释

我尝试了$scope.$apply（function（）{}）方法，它在控制台中返回一个错误：错误：[$rootScope:inprog]$apply已经在进行中

感谢您的帮助。谢谢

注入$timeout（如$scope），并用零参数包装将apply放入$timeout函数调用中的代码。这会安全地触发摘要，“推荐”

$timeout(function() {
     // model update here
 }) 

---

我认为这是由于儿童范围问题，马克·拉科克在另一个类似问题上有一个很好的答案-

简言之，他写道

每次Angular编译器在HTML中找到ng控制器时，都会创建一个新的作用域。（如果使用ng view，则每次转到不同的路由时，也会创建一个新的作用域。）

---

如果您需要在控制器之间共享数据，通常服务是您的最佳选择。将共享数据放入服务，并将服务注入控制器：“

仅为了记录，建议您将

$scope.notes.splice（0,0，{…}）

替换为

$scope.notes.unshift（{…}）

。你能提供plnkr吗？我试过了，但我在chrome错误控制台中得到了：2ionic.bundle.js:19387 TypeError:undefined不是completeOutstandingRequest（）的函数，你在相关块上写的确切代码是什么？可能是这样，我使用模式重新编码，它工作得很好。我会考虑包括一项服务。