Question

我试图将角度控制器中的对象数组传递给自定义指令元素，并使用ng-repeat迭代对象，但我没有获取数据。

$scope.mydata=[


    {
        "_id":"1",
        displayConfig:[
              {
      "fieldIndex": 2,
"propertyName": "o1",
"propertyValue": "sree"
              },{
      "fieldIndex": 2,
"propertyName": "o2",
"propertyValue": "sravs"
              },{
      "fieldIndex": 2,
"propertyName": "o3",
"propertyValue": "sree"
              },

          ],
        "name": "Alabama",
        "abbreviation": "AL"


    },
    {
        "_id":"2",
        displayConfig:[
              {
      "fieldIndex": 2,
"propertyName": "o1",
"propertyValue": "yui"
              },{
      "fieldIndex": 2,
"propertyName": "o2",
"propertyValue": "juim"
              },{
      "fieldIndex": 2,
"propertyName": "o3",
"propertyValue": "aww"
              },

          ],
        "name": "Alaska",
        "abbreviation": "AK"
    },
    {
        "_id":"3",
        displayConfig:[
              {
      "fieldIndex": 2,
"propertyName": "o1",
"propertyValue": "fgt"
              },{
      "fieldIndex": 2,
"propertyName": "o2",
"propertyValue": "ertyu"
              },{
      "fieldIndex": 2,
"propertyName": "o3",
"propertyValue": "ghytt"
              },

          ],

        "name": "bmerican Samoa",
        "abbreviation": "AS"
    },
    {
        "_id":"4",
        displayConfig:[
              {
      "fieldIndex": 2,
"propertyName": "o1",
"propertyValue": "hjjhu"
              },{
      "fieldIndex": 2,
"propertyName": "o2",
"propertyValue": "rdrer"
              },{
      "fieldIndex": 2,
"propertyName": "o3",
"propertyValue": "xds"
              },

          ],
        "name": "drizona",
        "abbreviation": "AZ"
    },
    {
        "_id":"5",
        displayConfig:[
              {
      "fieldIndex": 2,
"propertyName": "o1",
"propertyValue": "errrr"
              },{
      "fieldIndex": 2,
"propertyName": "o2",
"propertyValue": "ddd"
              },{
      "fieldIndex": 2,
"propertyName": "o3",
"propertyValue": "nnnn"
              },

          ],
        "name": "crkansas",
        "abbreviation": "AR"
    }

];

html文件...........

<search items="mydata" prompt="Start typing a US state" title="mydata.displayConfig[0].propertyName" subtitle="abbreviation" id="_id" model="_id" on-selectupdate="onItemSelected()" />

directive.js

.directive('search', function($timeout) {
  return {
    restrict: 'AEC',
    scope: {
        items: '=',
        prompt:'@',
        title: '@',
        subtitle:'@',
        model: '=',
        onSelectupdate:'&'
    },
    link:function(scope,elem,attrs){
       scope.handleSelection=function(selectedItem){
         scope.model=selectedItem;
           console.warn(scope.items);
         scope.current=0;
         scope.selected=true;        
         $timeout(function(){
             scope.onSelectupdate();
          },200);
      };
      scope.current=0;
      scope.selected=true;
      scope.isCurrent=function(index){
         return scope.current==index;
      };
      scope.setCurrent=function(index){
         scope.current=index;
      };
    },
templateUrl : TAPPLENT_CONFIG.HTML_ENDPOINT[0]+'home/genericsearch.html'  }
})

genericsearch.html

<div class="multitext-wrap blue-border">
<input type="text" ng-model="model"  ng-keydown="selected=false"/><br/> 
<div class="items" ng-hide="!model.length || selected">
    <div class="item" ng-repeat="item in items" ng-click="handleSelection(item[title])" style="cursor:pointer" ng-class="{active:isCurrent($index)}" ng-mouseenter="setCurrent($index)">
        <p class=" tag-label">{{item[title]}}</p><span class="tag-cross pointer" ng-click="removeOrg($index);">x</span>

    </div>
</div> 
</div>

请帮助解决这个问题。提前谢谢

Answer 1

您可以通过attrs在链接功能中访问它：

function(scope,elem,attrs)
{  
 var mydata = attrs.model; 
}

但是你的做法有些不对劲。我认为这里更聪明，也更容易使用服务或工厂。

type()

将此与链接功能的attrs参数

结合使用

Answer 2

尝试观察您的参数。可能你在尝试之前尝试使用它。

.directive('search', function($timeout) {
  return {
    restrict: 'AEC',
    scope: {
        items: '=',
        prompt:'@',
        title: '@',
        subtitle:'@',
        model: '=',
        onSelectupdate:'&'
    },
    link:function(scope,elem,attrs){
       scope.handleSelection=function(selectedItem){
         scope.model=selectedItem;
           console.warn(scope.items);
         scope.current=0;
         scope.selected=true;        
         $timeout(function(){
             scope.onSelectupdate();
          },200);
      };

      scope.$watch("items", function(newData) {
          console.log("Items: ", newData);
      });


      scope.current=0;
      scope.selected=true;
      scope.isCurrent=function(index){
         return scope.current==index;
      };
      scope.setCurrent=function(index){
         scope.current=index;
      };
    },
templateUrl : TAPPLENT_CONFIG.HTML_ENDPOINT[0]+'home/genericsearch.html'  }
})

从控制器传递数据数组到自定义指令？

2 个答案: