Question

我已经精确地遵循Angular文档来获取一个指令，该指令使用包含来自父控制器范围对象的几个变量的隔离范围。

app.controller('MainCtrl', function($scope) {
    $scope.name = 'Parent Name';

    $scope.pokie = {
        whyIs: "thisUndefined?"
    };
});

app.directive('parseObject', function() {

    var preLink = function($scope, el, att, controller) {
        console.log('[link] :: ', $scope);
    };

    var postLink = function($scope, el, att, controller) {
        console.log('[PostLink] :: ', $scope);
        console.log('[$Parent] :: ', $scope.$parent.name);
    };

    return {

        restrict: 'E',
        scope: {
            myPokie: '=pokie',
            name: '=name'
        },
        template: [
          '<div>',
          '<h1>Directive does not get parent scope</h1>',
          '<h1>{{ myPokie }}</h1>',
          '<h2>{{ name }}</h2>',
          '</div>'
        ].join(''),

        compile: function() {
            return {
                pre: preLink,
                post: postLink
            }
        }
    }
});

http://plnkr.co/edit/FpQtt9?p=preview

有谁能告诉我我的代码有什么问题？为什么指令的隔离范围会为＆＃39; myPokie＆＃39;返回未定义的值。和＆＃39;名称＆＃39;？

我已经看到其他人说你必须使用$ scope.watch这个......但有角度的指令文件并没有说明这一点......而且我真的不喜欢这样做。我想使用$ scope.watch来做一些如此微不足道的事情，它应该是开箱即用的。

Answer 1

当您在指令中声明隔离范围时，这意味着您将使用属性为指令提供这些值。

 scope: {
     myPokie: '=pokie',
     name: '=name'
 }

这意味着您的指令范围不会从父范围原型继承。 pokie属性提供myPokie＆amp;的值name属性将为您的指令name提供值=，如果您的myPokie值在指令中发生更改，则指示双向绑定，相同的引用值将在父级中更改控制器。 name属性也是如此。

您的指令元素标记应为：

<parse-object pokie="pokie" name="name"></parse-object>

Working Plunkr

Answer 2

您正在使用隔离范围，但您没有传递变量。问题出在您的HTML中：

更改您的HTML：

<parse-object></parse-object>

要：

<parse-object pokie="pokie" name="name"></parse-object>

隔离范围从DOM元素获取其参数。所以如果你有范围声明：

myPokie: '=pokie',

这意味着myPokie变量应取自范围内的pokie属性。您的name: "=name"可以更改为name: "="，因为它的名称完全相同。

Plunker

为什么我的角度指令没有在隔离范围内获得父控制器范围？

2 个答案: