массив объектов, не передаваемых в свойство Scope директивы - PullRequest
0 голосов
/ 07 апреля 2019

У меня есть контроллер ToolCtrl следующим образом:

function ToolCtrl() {

var vtc = this;
vtc.selectedItem = [ {"id":768,"coOwnerChoruspath":null,"coOwnerLocation":null,"counterPartOwner":"NA","counterPartOwnerEmail":"NA","criticality":"Mandatory","dlinks":[],"edvCategory":null,"filterItems":[{"id":309,"genericFilter":{"id":47,"activeFlag":"tool","description":"Which password policy does it use?","title":"Password Policy used"},"item":"N/A","itemDesc":"Not Applicable"},{"id":315,"genericFilter":{"id":49,"activeFlag":"tool","description":"Which environments does it access?","title":"Environments accessed"},"item":"PPT","itemDesc":"PPT, QAT, STG, AP1, DRPPT"},........];
}

У меня есть директива toolDir с вышеуказанным контроллером следующим образом:

.directive('toolDir', function(){
return {
    restrict: 'EA',
    transclude: true,

    controller: ToolCtrl,
    controllerAs: '$ctrl',
    scope: {
        selectedItem: '=',
    },
    link: function (scope, element, attrs, ctrl, transclude) {
        var selectedItem = scope.selectedItem;
        transclude(scope, function (clone) {
            element.append(clone);
        });
    }
    }

    });
    })

Я использовал директиву следующим образом:

<html code>
<tool-dir selected-item="$ctrl.selectedItem">{{$ctrl.selectedItem}}</tool-dir>

Данные здесь не отображаются.

Ожидается вывод:

[ {"id":768,"coOwnerChoruspath":null,"coOwnerLocation":null,"counterPartOwner":"NA","counterPartOwnerEmail":"NA","criticality":"Mandatory","dlinks":[],"edvCategory":null,"filterItems":[{"id":309,"genericFilter":{"id":47,"activeFlag":"tool","description":"Which password policy does it use?","title":"Password Policy used"},"item":"N/A","itemDesc":"Not Applicable"},{"id":315,"genericFilter":{"id":49,"activeFlag":"tool","description":"Which environments does it access?","title":"Environments accessed"},"item":"PPT","itemDesc":"PPT, QAT, STG, AP1, DRPPT"},]

Ответы [ 2 ]

0 голосов
/ 07 апреля 2019

Ваш код кажется идеальным. Я скопировал ваш код на мою машину, и он работает так, как вы ожидаете. Если это не работает на вашем компьютере, попробуйте создать функцию ToolCtrl внутри области действия директивы. (Я предполагаю, что ваше приложение называется angularApp);

Примерно так:

angularApp.directive('toolDir', function(){

  function ToolCtrl(){
    var vtc = this;
    vtc.selectedItem = [{key1:'value1'},{key2:'value2'}];
  }

  return {
      restrict: 'EA',
      transclude: true,  
      controller:ToolCtrl,
      controllerAs: '$ctrl',
      scope: {
          selectedItem: '=',
      },
      link: function (scope, element, attrs, ctrl, transclude) {
          var selectedItem = scope.selectedItem;
          transclude(scope, function (clone) {
              element.append(clone);
          });
      }
      }
});

Надеюсь, это поможет!

0 голосов
/ 07 апреля 2019

Пожалуйста, посмотрите на это скрипка . Это рабочий пример того, что вы пытаетесь сделать.

Я копирую / прошёл ваш код, похоже, вы не написали контроллер.

function ToolCtrl($scope) {
   this.selectedItem = $scope.selectedItem;
}
...