onsen-ui2 - onsen ui2 - angularjs を使用したマスター詳細ページ

Question

angularjs でマスター詳細ページを作成するにはどうすればよいですか。json ファイルからデータを呼び出すファクトリを作成し、リスト コントローラーを作成してリスト項目のタイトルをリストしましたが、ビュー コントローラーに到達するとエラーが発生します。コードの例は以下のとおりです

 var cachedData;

    function getData($scope, callback) {

        $http.get('js/husbandry.json').success(function(data) { // call data from json file
            $scope.items = data.items;
            callback(data.items);
            console.log(data);
        }).error(function() {
            ons.notification.alert({
                message: 'Could not Connect to the Database.'
            });
        });
    }

    return {
        list: getData,
        find: function(data, callback) {
            var hb = cachedData.filter(function(items) {
                return items.title == data;
            })[0];
            callback(hb);
        }
    };
});

module.controller('ListCtrl', function($scope, HB) {
    $scope.items = {
        title: 'day 2'
    }

    HB.list($scope.items.title, function(items) {
        $scope.items = items;
    });

    $scope.showDetail = function(title) {
        $scope.navi.pushPage("day1.html", { animation: "fade", items: title });
    }

});


module.controller('ViewCtrl', ['$scope', 'HB', function($scope, HB) {
    var page = $scope.navi.topPage.data;
    HB.find(page.options.data, function(hb) {
        $scope.items = hb;
    });
}]);