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。这是您要做什么的一个有效示例。

我复制/粘贴了您的代码，看来您没有编写控制器。

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);
          });
      }
      }
});

希望有帮助！

不传递给指令的Scope属性的对象数组

2 个答案: