Angularjs - 即使在父作用域中,函数在子作用域中未定义

时间:2014-05-15 09:35:17

标签: angularjs angularjs-directive angularjs-scope

我有这个plunkr:http://plnkr.co/edit/vuN0zVhXNMHUEPMeRvRg?p=preview 在这个plunkr中,我调用一个指令来获取函数" test"使用"&"来自父作用域运营商。 为什么当我尝试使用该函数时,它返回" undefined"?

HTML:

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.2.x" src="https://code.angularjs.org/1.2.16/angular.js" data-semver="1.2.16"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p my-directive>Hello {{name}}!</p>
  </body>

</html>

JS:

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
  $scope.test = function test(){
    alert('y');
  }
  console.log(angular.noop);
  console.log($scope.test);
});


app.directive('myDirective', [
    function () {
      return {
        restrict: 'EAC',
        scope: {
          value: '@', // some value
          test: '&' // the function
        },
        link: function(scope, element, attrs) {
          function functionName(func) {
            var ret = func.toString();
            ret = ret.substr('function '.length);
            ret = ret.substr(0, ret.indexOf('('));
            return ret;
          }
          console.log(scope.test());
        }
      };
    }
  ]);

2 个答案:

答案 0 :(得分:2)

使用隔离范围时,在声明指令时,通过属性定义父范围和指令范围之间的链接。

所以,这段代码:

scope: {
          value: '@', // some value
          test: '&' // the function
        },

说,&#34;在声明指令的元素上寻找名为valuetest的属性。&#34;

所以,期待这个:

  <body ng-controller="MainCtrl">
    <p my-directive value="{{value}}" test="test()">Hello {{name}}!</p>
  </body>

有关文档,请参阅&#34;隔离指令的范围&#34; directive documentation

的部分

答案 1 :(得分:0)

达文是绝对正确的。

当您使用删除指令中定义的范围时,这将完全像您期望的那样工作(警报弹出)。

这是你的plunker fork:http://plnkr.co/edit/5T9ysjGPBfrhQXRuDGZA?p=preview可以工作。

默认情况下,指令的范围是从它所在的控制器继承的;但是通过在指令上定义scope属性,您创建了一个&#34; isoloated范围&#34;它不会从控制器继承。