1

我已经精确地遵循了 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

谁能告诉我我的代码有什么问题？为什么指令的 Isolate 范围会为“myPokie”和“name”返回未定义的值？

我见过其他人说你必须为此使用 $scope.watch .. 但是 angular 的指令文档对此没有任何说明.. 我真的不想将 $scope.watch 用于如此微不足道的事情应该开箱即用。

4

2 回答 2

4

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

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

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

您的指令元素标记应该是：

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

工作Plunkr

于 2015-05-05T20:02:59.800 回答
1

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

从以下位置更改您的 HTML：

<parse-object></parse-object>

至：

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

隔离作用域从 DOM 元素中获取其参数。因此，如果您在范围声明内：

myPokie: '=pokie',

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

普朗克

于 2015-05-05T20:03:05.927 回答