0

サイト内のユーザーのお気に入りのアイテムを表示するサイト上のログイン画面とウィジェットを備えたアプリがあります。

サイトのhtmlで

<header data-ng-controller="SideBarController">
    <section id="sidebar">
        <div sidebar-user-info></div>
        <div sidebar-my-favorites-list></div>
        <p class="full"><a href="#/logout">logout</a></p>
    </section>
</header>

インライン テンプレート ブロック

<script id="sideBarFavoritesList_template" type="text/ng-template">
    <ul id="my-favorites" class="full no-bullets">
        <li data-ng-repeat="fav in myFavorites">
            <a href="#" id="{{fav.id}}"><img ng-src="/gfx/apps/icons{{ fav.icon }}" width="36" height="36" alt="{{ fav.name }} icoon" class="favicon">{{ fav.name }}</a>
        </li>
    </ul>
</script>

次に、ウィジェットをレンダリングするディレクティブを取得しました

App.directive('sidebarMyFavoritesList', ['$rootScope', function sideBarMyfavoritesList($rootScope) {
    return {
        template: $('#sideBarFavoritesList_template').html(),
        restrict: 'A',
        replace: true
    };
}]);

サイドバー全体を囲むコントローラー

function SideBarController($http, $scope, $rootScope, helper, UserService)
{
    $rootScope.user = UserService.data;
    $rootScope.loggedIn = UserService.isLogged;

    $scope.toggleBar = function toggleBar() {
        if (!UserService.isLogged) {
            return;
        }
        $rootScope.state.appbar = !$rootScope.state.appbar;
    };

    var serviceUrl = "/api/favorites/user";
    $http.get(serviceUrl).success(function(d) {
        $scope.myFavorites = d.data;
    });
}

現在、UserServiceユーザーがログインすると更新されますが、サイドバーは常にそこにあります。私が望むのは、サイドバーが更新され、ユーザーのお気に入りが表示されることです。

ユーザーが正常にログインした後、rootScope のユーザー オブジェクトを更新します。しかし、それは非常にハッキーに感じます。

私の見方では、ユーザーがログインした後、そのサービスへのajax呼び出しをやり直す必要がありますが、どこでそれを行うべきかわかりません。

ログイン後にページを更新すると、最初のページ読み込みの開始時にサーバー側でユーザーセッションが利用できるため、すぐに機能します。

4

2 に答える 2

0

UserService が $rootScope.user を更新する場合、SideBarController から $rootScope.user を監視し、$scope.myFavorites を更新することができます。

于 2013-07-29T15:29:31.013 に答える