javascript - 如何在与链接函数隔离的范围内设置范围变量

Question

我试图在隔离范围内设置变量，但我无法访问我在隔离范围内的链接函数中设置的变量，而且我可以访问 Controller 的变量。

app.directive('myDir', function($timeout) {
    return {
        restrict: 'A',
        scope: {
            'propVar': '='
        },
        link: function(scope, elem) {
            console.log(elem)
            scope.linkVar = 'It works!' 
            console.log(scope);
        },
    }
})

我创建了 plunker 来展示我的意思:http://plnkr.co/edit/lUBvIkF4fKXkEgujJpuU?p=preview

Answer 1

一切正常。

1) 如果您定义了 'propVar' : '=' 这意味着您的指令元素具有属性 prop-var。不是这种情况。如果您想使用 prop 属性，您必须以这种方式定义隔离范围:'propVar' : '=prop'。

2) 指令的子元素绑定(bind)到 Controller 范围而不是指令范围。如果您希望子元素成为指令的一部分，您可以在指令中使用模板:

app.directive('myDir', function() {
    return {
        restrict: 'A',
        template: '<div><p>linkVar: {{ linkVar }}</p><p>propVar: {{ propVar }}</p><p>foo: {{ foo }}</p><button ng-click="foo=\'directive sucks\'">press me</button></div>',
        scope: {
            propVar: '=prop'
        },
        link: function(scope, elem) {
            console.log(elem)
            scope.linkVar = 'It works!' 
            console.log(scope);
        },
    }
})

查看修改后的 PLUNKR:http://plnkr.co/edit/MHXXkmPdtfAUqtre4Fbg?p=preview