在不使用隔离作用域的情况下将变量传递给AngularJS指令

Question

我正在学习AngularJS指令，我想做的一件事是将一些变量$scope.message传递到父级scope（一个controller的scope），并且我希望它在alert指令内被重命名为param。我可以通过隔离作用域来实现：

<div alert param="message"></div>

并定义

.directive("alert", function(){
    return{
        restrict: "A",
        scope: {
            param: "="
        },
        link: function(scope){
            console.log(scope.param) # log the message correctly
        }
    }
})

但我能否在不使用隔离作用域的情况下完成这个操作？假设我想要添加另一种指令 toast 到 <div toast alert></div> 中，并利用相同的 param（保持双向数据绑定），那么如果我按照直觉去做，会这样写：

.directive("toast", function(){
    return{
        restrict: "A",
        scope: {
            param: "="
        },
        link: function(scope){
            console.log(scope.param)
        }
    }
})

我肯定会收到一个错误：Multiple directives [alert, toast] asking for new/isolated scope on:<div...

所以总体来说，我的问题是，如何在没有隔离作用域的情况下重命名父级作用域变量，并且当两个指令放置在单个DOM上时如何共享变量？

- Lelouch

---

你想让两个指令绑定到同一个父级 $scope 属性吗？ - Davin Tryon

Answer 1

修改您的提示指令:

.directive("toast", function(){
    return{
        restrict: "A",
        link: function(scope, elem, attrs){
            var param = scope.$eval(attrs.param);
            console.log(param)
        }
    }
})

示例fiddle。

由于toast现在与其父级具有相同的作用域（如果允许隔离作用域，它将与父作用域相同），因此您可以简单地调用$eval并使用param属性在作用域上获取值。

- Patrick

---

谢谢，运行得非常完美！我应该看一下$eval()文档。 - Lelouch

$eval()函数只返回值还是提供数据绑定？看起来它只返回值，但我想确认一下。 - Lelouch

这只是一个值。如果您需要模拟绑定，可以使用$watch...不过我认为这样可能会过度，因为您只需要再次使用$eval获取最新的值（例如在某些ngEvent上）。 - Patrick