AngularJS隔离范围没有被传递到指令

我一直在这个特定的测试我的头几个小时。我相信所展示的指令应该可以工作，但我正在传递给隔离范围的值未定义。AngularJS隔离范围没有被传递到指令

代码：

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/

任何帮助将是AP preciated，我一定在做错事。

来源

2013-10-03 francisco.preller

改变你的小提琴，看 –

变化=到@

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

@ - 结合父作用域属性的值（它总是一个字符串）本地范围。

= - 直接绑定父作用域属性，这将在传递之前评估

来源

2013-10-03 04:36:24

看到这个链接：http：//amitgharat.wordpress.com/2013/06/08/the-hitchhikers-guide-to-the-directive/。你可以找到例子和描述 –

您正在解释不正确的隔离范围构造。

当你说name=你说的是在指令声明html上有属性name和任何属性值存在的绑定到作用域中的属性名。

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

底线您的指令范围name - >容器范围test属性。

见我plunker这里http://jsfiddle.net/cmyworld/ANzUf/

来源

2013-10-03 04:34:14 Chandermani

我不明白下。我的标签有一个name =“test”的属性 - 这不是你要求我做的吗？ –

@ francisco.preller我已添加小提琴。看到我在这里说的行动http://jsfiddle.net/cmyworld/ANzUf/ – Chandermani

我明白了，现在它很有道理。谢谢（你的）信息！ –

AngularJS隔离范围没有被传递到指令

回答

相关问题