Question

我有一个元素指令，我想知道我是否可以从routeProvider获取参数来渲染我的模板并在我的控制器中设置它。

adminDash.directive('hospitals', function() {
    return {
        restrict: 'E',
        templateUrl: 'www/partials/admin/hospitals.html',
        controller: 'AdminHospitalsController',
        controllerAs: 'hospitalsCtrl',
    };
});

如何在element指令中获取任何参数？

Answer 1

您可以隔离指令的范围，如下所示：

adminDash.directive('hospitals', function() {
    return {
        restrict: 'E',
        templateUrl: 'www/partials/admin/hospitals.html',
        controller: 'AdminHospitalsController',
        controllerAs: 'hospitalsCtrl',
        scope: {
            paramValue: '&',
            paramVariable: '=',
        },
    };
});

选中此项以更好地了解https://thinkster.io/egghead/isolate-scope-am/

Answer 2

有两种方法：两种方法都涉及使用$routeParams服务，它允许您检索当前的路由参数集。

鉴于您在http://example.com/#/hospitals/foobar中配置了网址/hospitals/:hospital/和路由$routeProvider，您可以：

1.将$ routeParams注入您的指令：

adminDash.directive('hospitals', function($routeParams) {
    return {
        restrict: 'E',
        templateUrl: 'www/partials/admin/hospitals.html',
        controller: 'AdminHospitalsController',
        controllerAs: 'hospitalsCtrl',
        link: function(scope, element){
            scope.hospital = $routeParams.hospital;
        }
    };
});

2.将$ routeParams注入AdminHospitalsController

adminDash.controller('AdminHospitalsController', function($scope, $routeParams) {
    $scope.hospital = $routeParams.hospital;
}

这两种方法都会导致你的指令范围内有hospital=foobar;

从element指令中的routeProvider获取参数

2 个答案: