Javascript 未解析AngularJS指令范围（“未定义属性名称”错误）

指令码

mymodule.directive('eicon', function(){
    return {
        restrict: 'E',
        scope: {
            attr: '='
        },
        template: "test " + attr.name
    }
});

Html

---

我遇到以下错误：

ReferenceError:attr未定义

。怎么了？

既然您正在声明隔离作用域属性

attr

，您应该能够访问模板中的

scope.attr

，如下所示：

mymodule.directive('eicon', function(){
    return {
        restrict: 'E',
        scope: {
            attr: '='
        },
        template: "test {{attr.name}}"
    }
});

---

演示：

既然您正在声明隔离作用域属性

attr

，您应该能够在模板中访问

scope.attr

，如下所示：

mymodule.directive('eicon', function(){
    return {
        restrict: 'E',
        scope: {
            attr: '='
        },
        template: "test {{attr.name}}"
    }
});

---

演示：

attr

可在作用域中访问，因此您可以在控制器或链接阶段访问

scope.attr

，或在模板中访问

{attr}

。一个简单的解决方案是将模板更改为

mymodule.directive('eicon', function(){
    return {
        restrict: 'E',
        scope: {
            attr: '='
        },
        template: "test {{attr.name}}",
        link: function (scope, element, attrs) {
          console.log(scope.attr);
        },
        controller: function (scope) {
          console.log(scope.attr);
        }
    }
});

---

attr

可以在作用域中访问，因此您可以在控制器或链接阶段访问

scope.attr

，或者在模板中访问

{{attr}

。一个简单的解决方案是将模板更改为

mymodule.directive('eicon', function(){
    return {
        restrict: 'E',
        scope: {
            attr: '='
        },
        template: "test {{attr.name}}",
        link: function (scope, element, attrs) {
          console.log(scope.attr);
        },
        controller: function (scope) {
          console.log(scope.attr);
        }
    }
});

---

如果我需要访问代码怎么办？该模板将取决于该值“访问代码”是什么意思？你是说可以使用

scope.attr

object操作的链接函数吗？@dfsq你可以查看我的答案中的示例如果我需要访问代码怎么办？该模板将取决于该值“访问代码”是什么意思？你是说可以使用

scope.attr

object操作的链接函数吗？@dfsq你可以查看我的答案中的示例