未传递到指令范围属性的对象数组

Question

我有一个控制器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"},]

Answer 1

请看那个fiddle。这是您正在尝试做的事情的一个工作示例。

我copy/past你的代码，你好像没写controller

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

Answer 2

您的代码看起来很完美。我在我的机器上复制了您的代码，它按照您期望的方式工作。如果这在您的机器上不起作用，请尝试在指令范围内创建函数 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);
          });
      }
      }
});

希望对您有所帮助！

未传递到指令范围属性的对象数组

array of objects not passing into Scope property of directive

angularjs

angularjs-directive

未传递到指令范围 属性 的对象数组

array of objects not passing into Scope property of directive

angularjs

angularjs-directive

未传递到指令范围属性的对象数组