1

我正在 angularjs 中设计一个基于表格结构的 cms,其中可以在选项卡中打开和编辑多篇文章。我正在为文章使用 articleController。对于每篇文章的 url 参数(主要是文章 id)都是不同的。

我并试图使这些标签具有粘性。

以下是我编写的代码: 路线:

$urlRouterProvider.otherwise('/');
            $urlRouterProvider.deferIntercept();
            $stickyStateProvider.enableDebug(true);

            //States definition for tabbed routes
            $stateProvider.state('main', {
                url:         '/?ssoToken',
                templateUrl: 'main.html',
                controller: 'MainController',
                abstract:true
            }).state('main.dashboard', {
                url:         'dashboard',
                views: { 'dashboard@cmslite': { controller: 'DashboardController', templateUrl: 'dashboard.html'}},
                sticky: true
            }).state('main.article', {
                url:         'article?id',
                views: { 'article@cmslite': { controller: 'ArticleController', templateUrl: 'article_partial.html'}},
                sticky: true
            });

主控制器:-

 $scope.tabData   = [
                        {
                            heading: 'Dashboard',
                            route:   'cmslite.dashboard',
                            params:$scope.$routeParams,
                            view:'dashboard'
                        },
                        {
                            heading: 'Article',
                            route:   'cmslite.article',
                            params:$scope.$routeParams,
                            view:'article'
                        }
                    ];
$scope.matchTabStates=function(tab){
                        if($state.includes(tab.route)){
                            if(Utils.arraysEqual(tab.params,$scope.$routeParams)){
                                return true;
                            }
                        }
                        return false;
                    };

main.html

<div ng-repeat="tab in tabData" ui-view="{{tab.view}}" ng-show="matchTabStates(tab)"></div>

仪表板控制器

//To add articles in tabs dynamically
$scope.editArticle = function(id,title){
                var reqParam = {id: id, ssoToken: MainProperties.ssoToken};
                if(id!=null && id!="") {
                    $scope.$parent.tabData.push({
                            heading: 'Article: ' + title,
                            route: 'cmslite.article',
                            params: reqParam,
                            view:'article'
                        }
                    );
                }
            };

因此,用户可以添加新标签以从标签中编辑不同的文章。

当标签从一篇文章切换到另一篇文章时,当标签粘性状态超过一篇文章时出现问题,因为它们使用相同的控制器。有什么建议么?

4

1 回答 1

0

最后我得出了摆脱 UI 路由器、粘性状态并使用 ngshow 和 nghide 自己开发此功能的结论。它工作得很好。

所用代码的详细说明见:

使用参数缓存 URL 视图/状态

于 2015-02-02T09:39:02.993 回答