Почему моя угловая директива не позволяет охватить диапазон родительского контроля внутри изолированного пространства?

Question

Я внимательно следил за Angular docs, чтобы получить директиву, работающую с изолированной областью, содержащей пару vars из объекта scope родительского контроллера.

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 для этого .., но директивные документы угла не говорят об этом. И я действительно не хочу использовать $ scope.watch для что-то настолько тривиальное, что должно работать из коробки.

Answer 1

Как вы указали изолированную область действия в своей директиве, это означает, что вы будете предоставлять эти значения своей директиве, используя атрибут.

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

Это означает, что ваша область действия директивы не будет прототипически унаследована от родительской области. pokie атрибуты обеспечивают значение для myPokie & name атрибута обеспечит значение name для директивы, = указывающего два способа связывания, если ваши изменения myPokie значения в директиве, то же значение, реферирование изменится в родительском контроллере. То же самое верно для атрибута name.

Ваша директива элемент разметки должен быть:

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

Working Plunkr

Answer 2

Вы используете изолированную сферу, но вы не передаете переменные. Проблема в вашем HTML:

Изменить HTML из:

<parse-object></parse-object> 

To:

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

Изолированный сфера имеет свои параметры из элемента DOM. Так что если у вас есть в декларации области видимости:

myPokie: '=pokie', 

Это означает, что myPokie переменные должны быть взяты из атрибута pokie, что по Сфере. Ваш name: "=name" можно изменить на name: "=", так как это одно и то же имя.

Plunker