javascript - URLルートするとデータが消える

Question

tabletop.js、handlebars.js、angular.js を使用して Web アプリを作成しています

したがって、データはGoogleスプレッドシートからフェッチされ、ルーティングに角度を使用していますが、別のページにルーティングして戻ってくるとデータが消えます

これがそのプランカーです

誰か解決策を教えてください。検索してみましたが、まだ運がありません:/

卓上コントローラー

  var public_spreadsheet_url = 'https://docs.google.com/spreadsheet/pub?hl=en_US&hl=en_US&key=0AkLy8qCw6J5EdGlmeFZEVVVZZ3ZUSEhYcjhEdEZKelE&output=html';

  $(document).ready( function() {
    Tabletop.init( { key: public_spreadsheet_url,
                     callback: showInfo,
                     parseNumbers: true } );
  });

  function showInfo(data, tabletop) {
    var source   = $("#cat-template").html();
    var template = Handlebars.compile(source);

    $.each( tabletop.sheets("Cats").all(), function(i, cat) {
      var html = template(cat);
      $("#content").append(html);
    });
  }

そして、これらは角度のあるスクリプトです

    var routeApp = angular.module('routeApp', []);

    routeApp.filter('range', function() {
        return function(input, total) {
            total = parseInt(total);
            for (var i=0; i<total; i++) {
                input.push(i);
            }
            return input;
        };
    });

    routeApp.config(function($routeProvider, $locationProvider) {

        $routeProvider.
            when('/home', { controller: HomeCtrl, templateUrl: 'partials/home.html' }).
            when('/movie/:id', { controller: BlogDetailCtrl, templateUrl: 'partials/movieDetail.html' }).
            when('/product', { controller: ProductCtrl, templateUrl: 'partials/product.html' }).                
            otherwise({ redirectTo: '/home' });

        $locationProvider.html5Mode(false);

    });

    function MainCtrl($scope) {

        $scope.navs = [
            { text: 'Products', href: '#/product' },                
        ];

    }

    function HomeCtrl($scope) {         
        console.log($scope);            
    }

    function BlogDetailCtrl($scope, $routeParams) {
        $scope.id = $routeParams.id;

        $scope.youAreClick = function(what) {
            alert('You are click on ' + what);
        }
    }

    function ProductCtrl($scope) {          
        $scope.items = [
            { grid: 3.5, filename: '360x270' },
            { grid: 3.5, filename: '260x120' },
            { grid: 3, filename: '160x120' },
            { grid: 3, filename: '260x120' },
            { grid: 3, filename: '260x120' } 
        ];          
    }

Answer 1

コントローラーは、ルートが変更されるたびにオンザフライで作成/破棄されます。それらに保存されたデータは永続的ではありません。

これを克服する 1 つの方法は、Serviceを使用することです。

ドキュメントに記載されているように、「最後に、すべての Angular サービスがアプリケーション シングルトンであることを認識することが重要です。」

Answer 2