Question

我正在构建一个自定义指令，我想从我的控制器访问隔离的范围变量。

这是html的样子：

<display-user-comment userId="user.id"></display-user-comment>

这是我的指令的样子：

    app.directive('displayUserComment', function () {
        return {
            restrict: 'E',
            templateUrl: 'user_comment.html',
            scope: {
                userId: '='
            },
            controller: 'UserCommentController as userCmtCtrl'
        };
    })

以下是我的控制器的样子：

app.controller('UserCommentController', [
    '$scope',
    function ($scope) {

    //How to get access to userId ??
}]);

如何在我的控制器中访问隔离到变量userId？

这里是plunker url http://plnkr.co/edit/9Lh9sPp8o7gZLs1h8RDs?p=preview

Answer 1

您使用了错误的属性名称。当您使用指令属性时，它将使用短划线（userId = user-id）进行渲染。这是更新的plunkr http://plnkr.co/edit/I8TWzTBh7IvZZxtaQ5sk?p=preview

 <display-user-comment user-id="23"></display-user-comment>

Answer 2

在html中将userId更改为user-id。 angular“规范化”属性名称，因此html中的user-id作为属性名称变为指令中的scope.userId。

了解更多信息https://docs.angularjs.org/guide/directive：

Angular规范化元素的标记和属性名称，以确定哪些元素与哪些指令匹配。我们通常通过其区分大小写的camelCase规范化名称（例如ngModel）来引用指令。但是，由于HTML不区分大小写，我们通过小写形式引用DOM中的指令，通常使用DOM元素上的划线分隔属性（例如ng-model）。

规范化过程如下：

从元素/属性的前面剥离x-和data-。   将：， - 或_分隔的名称转换为camelCase。

如何从控制器中的指令获取范围变量？

2 个答案: