Question

我几个小时都在这个特定的测试中摸不着头脑。我相信所展示的指令应该正常工作，但我对于传递给隔离范围的值未定义。

代码：

HTML

<!doctype html>
<html ng-app="myApp">
<body>
    <a ng-href="#" class="test-scope" name="test">Console should say 'test' but gives undefined</a>
</body>
</html>

的javascript

angular.module('myApp', [])
    .directive('testScope', function() {
        return {
            restrict: 'C',
            scope: {
                name: "="
            },
            link: function(scope, element, attrs) {
                console.log(scope.name);
            }
        };
    });

这里是小提琴：http://jsfiddle.net/jPtb3/8/

任何帮助都会受到赞赏，我一定是做错了。

Answer 1

您正在错误地解释隔离的范围构造。

当您说name=时，您说的是指令声明html中存在同名name的属性，无论属性值是什么，请绑定到作用域中的该属性名称。

在这种情况下，在声明指令的范围内应该有一个范围属性名test。指令范围上的name属性将指向父级（不是字面意思）

上的此测试属性

底线指令范围name - ＆gt;容器范围test属性。

在这里查看我的plunker http://jsfiddle.net/cmyworld/ANzUf/

Answer 2

将=更改为@

angular.module('components', [])
.directive('testScope', function() {
    return {
        restrict: 'C',
       scope: {
            name: "@"
        },
        link: function(scope, element, attrs) {
            console.log(scope.name);
        }
    };
})

angular.module('myApp', ['components']);

请参阅修复 Fiddle

@ - 将父作用域属性（始终为字符串）的值绑定到本地作用域。

= - 直接绑定父范围属性，在传入之前将对其进行评估。

AngularJS Isolate范围未传递给指令

2 个答案: