具有有限选项的 Angular JS 路由参数答案

【问题标题】：Angular JS route parameters with limited options具有有限选项的 Angular JS 路由参数
【发布时间】：2016-12-02 15:11:54
【问题描述】：

我刚开始使用 Angular，目前使用的是 1.4.2。我想知道如何为 URL 提供三个选项，/:type - 创建、更新和查看。

他们都使用相同的控制器，所以我不想有单独的时间，例如

.when('/create ... , .when('/update ... , .when('/view ... .

我不希望在这些选项之外传递任何其他选项。如果我能得到一些帮助，那就太好了！谢谢:)

【问题讨论】：

创建 3 个单独的规则。
您的意思是三个.when 案例？但这就是我想避免的，因为他们都将使用相同的控制器。在该控制器中，将相应地设置标志。
您可以使用相同的控制器，也可以使用不同的控制器。不确定我是否理解您的问题。

标签： angularjs url url-parameters ngroute

【解决方案1】：

您可以从控制器上的 $routeParams 服务获取参数，然后执行您想要使用它执行的任何逻辑。见https://docs.angularjs.org/api/ngRoute/service/$routeParams

路由配置

$routeProvider
    .when("/yourroute/:type", {
        template: "default"
        templateUrl: "template.html",
        controller: "Controller"
    });

控制器功能

function Controller($routeParams) {
    switch($routeParams.type) {
        case "create":
            ...
        case "update":
            ...
        case "view":
            ...
        default:
            ...
    }
}

【讨论】：

谢谢！ :) 我想这就是我要找的:)

【解决方案2】：

但是你想要 3 个不同的 url 吗？您应该使用 ui-router 和 stateHelperProvider 来使用子语句 il 您不想在何时声明多个。你应该能够做类似的事情

stateHelperProvider.state({
            name: 'root',
            template: '<ui-view/>',
            abstract: true,
            children: [
                    {
                        name: 'create',
                        url: '/create',
                        templateUrl: 'mypath.html',
                        controller: 'myCtrl',
                        data: {
                            type: 'create'
                        }
                    },
                {
                    name: 'view',
                    url: '/view',
                    templateUrl: 'mypath.html',
                    controller: 'myCtrl',
                    data: {
                        type: 'view'
                    }
                },
                {
                    name: 'update',
                    url: '/update',
                    templateUrl: 'mypath.html',
                    controller: 'myCtrl',
                    data: {
                        type: 'update'
                }
                },
            ]
            });

每次数据与您的数据一起使用。但我不明白你为什么不声明3“何时”

【讨论】：

是的，根据我传入的类型，将分配标志。例如，如果类型是视图，那么我将禁用这些字段。
谢谢！ :) 但是，当您为每个孩子有不同的 html 文件和控制器时，这似乎很有用。