двусторонний связывают изолированную область не работает в пользовательской директиве - AngularJS

Question

недавно я мигрировал мою угловую версию 1.2 до 1.5.x

я столкнулся вопросом, где отдельные элементы сферы применения не являются обязательным в пользовательской директиве. Я не могу видеть $scope.menuitems при отладке, что вызывает menu.menuitems как «undefined».

Directive: 
    angular.module('myapp') 
      .directive('menuSelect', menuSelect); 
     function menuSelect() { 
      var directive = { 
       link: linkFunc, 
       controller: menuselectController, 
       controllerAs: 'menu', 
       restrict: 'A', 
       replace: true, 
       bindToController: true, 
       require: '^form', 
       scope: { 
        menuitems: '=', 
        showError: '=', 
        ismenuSelectionAllowed: '=', 
        onMenuitemChange: '&', 

       }, 
       templateUrl: 'scripts/NavMenu/menuSelect/menuSelect.html' 
      }; 
      return directive; 
      function linkFunc(scope, el, attr, frm) { 
       var menu = scope.menu; 
       menu.menuForm = frm; 
       menu.selectmenu = function() { 
        menu.menuSelectionChanged(); 
       }; 
      } 
     } 
    menuselectController.$inject = ['$scope', '$filter']; 
     function menuselectController($scope, $filter) { 
      var menu = this; 
      var watcher2, categories = null; 
      menu.menuitems = $scope.menuitems; //I'm seeing the $scope doesn't bind the isolated elements. 
      menu.filter = null; 
      menu.selected = null; 
      menu.addFeature = addFeature; 
      menu.removeFeature = removeFeature; 
      ----- 
     ----- 
    } 

HTML, где директива звонит:

<div data-menu-select data-menuitems="menuitems" data-show-error="formAction=='Submit'" 
          data-is-menu-selection-allowed="menuSelectionAllowed" 
          data-on-menuitem-change="featureChanged()"></div> 

Answer 1

Вы используете контроллер в качестве синтаксиса. В этом случае ваши отдельные сферы применения proparties будет связан с этой в контроллере, а также $ scope.menu, так что вам не нужна эта линия

menu.menuitems = $scope.menuitems; 

это только делает menu.menuitems undefined, просто удалите эту строку или отладку, чтобы увидеть, что перед строкой menu.menuitems уже содержит значение, которое вы передали в data-menuitems атрибут в html-шаблоне. Подробнее о контроллере, как синтаксис здесь https://docs.angularjs.org/api/ng/directive/ngController

Так что это будет больше похоже

function menuselectController($scope, $filter) { 
    var menu = this; 
    var watcher2, categories = null; 
    menu.filter = null; 
    menu.selected = null; 
    menu.addFeature = addFeature; 
    menu.removeFeature = removeFeature; 
    ---------- 
} 

Смотрите также это быстрый codepen я сделал, чтобы продемонстрировать, что menu.menuitems уже содержит то, что вам нужно, это показывает предупреждение так что вы можете увидеть, что такое значение. Он использует угловое значение 1.5.5.

http://codepen.io/kmlzjc/pen/oLPQxa