Question

我正在使用Angular构建一个简单的图库，我正在尝试在某些路径上显示一个模板，这对于角度很容易。

some.site/#/gallery

完成了

App.config(['$routeProvider',
    function($routeProvider) {
        $routeProvider
            .when('/gallery', {
                templateUrl: 'js/views/gallery/main.htm',
                controller: 'galleryCtrl',
                controllerAs: 'gallery'
            })
            .otherwise({
                redirectTo: '/'
            });
    }
]);

但是当我想点击某个东西并进入

时，我想要一个div弹出窗口

some.site/#/gallery/thing/1

请注意，我仍然希望我的画廊位于后台。

我最初的想法是让div始终隐藏，除非有*/thing所以我可以在需要的时候得到*/thing/:id这样的id，但这种方法看起来相当丑陋，因为为什么会这样做一直挂在那里？

还有其他更好的方法吗？

Answer 1

你可以做的是根据路线设置$ routeParam，让我们说：

如果网址是/ gallery，那么＆＃39; showPopup＆＃39; = false
如果网址是/ gallery / thing /：id，那么＆＃39; showPopup＆＃39; = true

然后在你的html中将弹出状态绑定到$ routeParams.showPopup。

为此，您可以直接在映射中设置参数：

App.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider
        .when('/gallery', {
            templateUrl: 'js/views/gallery/main.htm',
            controller: 'galleryCtrl',
            controllerAs: 'gallery',
            resolve: {
              ignored: function ($route) { 
                 $route.current.params.showPopup = false; 
               }
            }
        })
        .when('/gallery/thing/:id', {
            templateUrl: 'js/views/gallery/main.htm',
            controller: 'galleryCtrl',
            controllerAs: 'gallery',
            resolve: {
              ignored: function ($route) { 
                 $route.current.params.showPopup = true; 
               }
            }
        })
        .otherwise({
            redirectTo: '/'
        });
  }
]);

希望我帮忙！

路由后缀上的AngularJS特定HTML

1 个答案: