Опции ng игнорируют массив $localStorage при обновлении страницы?

Question

Я создал Plunkr. Я нажимаю на элемент, когда нажимаю на кнопку, и цвет кнопки изменится на красный, и склеиваю элемент в массив, когда нажимаю на ту же кнопку, цвет кнопки изменится на зеленый.

Проблема в том, что хранилище сделано идеально. Кнопка $localStorage.tableArray не работает с выбранными опциями ng.

Когда я обновляю страницу, цвет кнопки также фиксируется с помощью ng-storage и ng-options останется.

1-й плункер с ng-хранилищем, 2-й плункер с массивами, пожалуйста, помогите мне.

 var app = angular.module('plunker', ["ngStorage"]);

 app.controller('MainCtrl', function($scope,$localStorage) {

     $scope.tablelist = [{"tablename":"t1"},{"tablename":"t2"}];

     if($localStorage.tableArray === undefined){
        $localStorage.tableArray = []
     }

     if($localStorage.tableslist === undefined){
         $localStorage.tableslist = []
     }

     $scope.getTable=function(table) {

         table.btnClass = table.btnClass == "btn-danger" ? "btn-success" : "btn-danger"
         var exists = false;

         angular.forEach($localStorage.tableArray, function (list,$index) {
            if ((list.tablename == table.tablename)) {
                console.log(list.tablename);
                console.log(table.tablename);
                exists = true;
                $localStorage.tableArray.splice($index,1);
                $scope.$storage=$localStorage.tableArray
                $localStorage.tableArray.splice($index,1);
                return false;
            }
        });

        if(!exists) {
            $localStorage.tableslist.push(table);
            $localStorage.tableArray = $localStorage.tableslist;
            console.log($localStorage.tableArray)
            table.color = "red"
        }
    } 
});