Question

我从控制器到指令

传递了价值

我的控制器中有两个数组

$scope.displayPeople.push(data.userName);
$scope.displayOrg.push(data.orgname);

我需要将这些数据从控制器传递到指令

我的指示

<div>

    <div class="multitext-wrap blue-border">

        <ul inputfocus>

<!--<li class="tag" ng-repeat="list in selecteditemsdisplay  track by $index"  ng-class="{selected: $index==selectedIndex}" >-->
                <!--<span class="tag-label">{{list}}</span><span class="tag-cross pointer" ng-click="Delete($index,selecteditemslist[$index],list,searchid)">x</span>-->
            <!--</li>-->

            <li class="tag" ng-repeat="list in displayItems  track by $index"  ng-class="{selected: $index==selectedIndex}" >
                <span class="tag-label">{{list}}</span><span class="tag-cross pointer" ng-click="Delete($index,selecteditemslist[$index],list,searchid)">x</span>
            </li>

            <li class="">
                <input type="text" ng-model="searchModel" ng-keydown="selected=false" ng-keyup="searchItem(searchModel,searchobj)"/>


            </li>

        </ul>
    </div>

<div class="typeahead"  ng-hide="!searchModel.length || selected">
    <div class="typeahead" ng-repeat="item in searchData | filter:searchModel | limitTo:8" ng-click="handleSelection(item,searchobj,$index,searchid)" style="cursor:pointer" ng-class="{active:isCurrent($index)}" ng-mouseenter="setCurrent($index)">
      <div class="bs-example">
    <div class="list-group list-group-item active">

            {{item.displayConfig[0].propertyValue}} {{item.displayConfig[1].propertyValue}}


    </div>
</div>


                    </div>
                </div>

</div>

我使用$ emit发送

控制器中的

$rootScope.$emit("displayEvent", {displayItems: $scope.displayPeople});


 $rootScope.$emit("displayEvent", {displayItems: $scope.displayOrg});

指令

中的

$rootScope.$on('displayEvent', function (event, args) {

                $scope.displayOrgs = args.displayItems;
                console.clear();
                console.info($scope.displayOrgs);
            });

通过这样做我得到重复代替组织（人和组织来了）

我怎么能解决这个问题请提前感谢

Answer 1

通过声明'scope：false'，您可以访问指令中的控制器范围。 'false'表示'不创建隔离的范围，继承控制器'。

.directive('myDirective', function() {
  return {
    scope: false,
    link: function($scope){
        //Do stuff with $scope.displayOrgs
        //Do stuff with $scope.displayPeople
    }
  };
});

此选项将创建一个隔离的范围并继承所选的变量。这是一种更清洁的方式。

 .directive('myDirective', function() {
      return {
        scope:{
           displayPeople:'=',
           displayOrg :'=',
        },
        link: function($scope){
            //Do stuff with $scope.displayOrgs
            //Do stuff with $scope.displayPeople
        }
      };
 });

Answer 2

使用$ emit进行控制器和指令之间的通信是不可取的
你需要使用“=”范围的指令来允许控制器和指令之间的双向通信，如：

<强>指令



    angular.module('YourModuleName').directive('yourDirectiveName',function () {
    return{
    restrict:'E',
    scope:{
         displayPeople:'=',
         displayOrg :'=',
     },
link: function postLink(scope, element, attrs) {
}
}
});

angular.module('YourModuleName').directive('yourDirectiveName',function () { return{ restrict:'E', scope:{ displayPeople:'=', displayOrg :'=', }, link: function postLink(scope, element, attrs) { } } });
与控制器相对应的模板

如何使用$ emit将数据从控制器传递到指令

2 个答案: