簡體   English   中英

使用$ emit從指令向控制器發送事件

[英]Send an event using $emit from directive to controller

我正在嘗試使用$emit從指令到控制器選擇一個項目時發送一個事件。 我有兩個組織更新功能,另一個用於人員。 我的指令應該指定應該發出哪個事件。

這是我的更新功能

//對於組織

 $scope.updateOrgs = function(selectedVal) {

 }

//對於人

$scope.updatepeople = function(selectedVal, type) {

}

如果是人,我的指令應該為updatepeople ()引發一個emit事件,如果它是org它應該引發updateorg()

我的指令看起來像......

.directive('search', function ($timeout) {
    return {
        restrict: 'AEC',
        scope: {
            model: '=',
            searchobj: '@',
        },
        link: function (scope, elem, attrs, index) {
            scope.handleSelection = function (selectedItem) {
                scope.model = selectedItem;
                scope.searchModel="";
                scope.current = 0;
                scope.selected = true;
                $timeout(function () {
                    scope.onSelectupdate();
                }, 200);
            };
            scope.Delete = function (index) {
                    scope.selectedIndex = index;
                    scope.delete({ index: index });
            };
            scope.Search = function (searchitem,event,searchobj) {
//                   alert('item entered'+name)
                   scope.searching = searchitem;
                   scope.searchobject = searchobj;
                   scope.onSearch({ searchitem: searchitem , searchobj:searchobj}); 
            };
            scope.current = 0;
            scope.selected = true;
            scope.isCurrent = function (index) {
                return scope.current == index;
            };
            scope.setCurrent = function (index) {
                scope.current = index;
            };
        },
        controller: ['$scope','$element','$rootScope','SearchOrg', function($scope,$element,$rootScope,SearchOrg) {
            $scope.searchItem = function(filter,searchobj){
                //alert('search'+searchobj);
                SearchOrg().fetch({'filter': filter, 'searchType': searchobj}).$promise.then(function(value){
                    $scope.searchData = value.data;
                    console.info($scope.searchData);
                },
                function(err) { 
                });
            }
        }],
        templateUrl: TAPPLENT_CONFIG.HTML_ENDPOINT[0] + 'home/genericsearch.html'
    }
});;

HTML片段

<search searchobj=“tei-org” selectedItems=“arrayofIds” search-id=”someidtoIdentify”/> 

我怎么能這樣做兩個函數都在不同的控制器中,我還需要使用$emit將指令中的參數發送到控制器?

使用$ scope。$ emit和$ scope。$ on

我猜你的其他控制器不是父母,所以看看使用$broadcast的第二個選項。

 var app = angular.module('app', []); app.controller('firstController', function($scope) { $scope.selectedOrgs = [] $scope.$on('updateorgs', function(evt, data) { $scope.selectedOrgs.push(data); }); }); app.controller('secondController', function($scope) { $scope.selectedPeople = [] $scope.$on('updatepeople', function(evt, data) { $scope.selectedPeople.push(data); }); }); app.directive('someDirective', function($rootScope) { return { scope: {}, link: function(scope) { scope.options = [{ id: 1, label: 'org a', type: 'org' }, { id: 2, label: 'org b', type: 'org' }, { id: 3, label: 'person a', type: 'person' }, { id: 4, label: 'person b', type: 'person' }]; scope.changed = function() { if (scope.selected) { var updatetype = scope.selected.type; if (updatetype === 'person') { $rootScope.$broadcast('updatepeople', scope.selected); } else if (updatetype === 'org') { $rootScope.$broadcast('updateorgs', scope.selected); } } }; }, template: '<select ng-change="changed()" ng-model="selected" ng-options="option.label for option in options"><option value="">Select</option></select>' }; }); 
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> <div ng-app='app'> <some-directive></some-directive> <div ng-controller='firstController'> <div>ORGS:</div> <div> {{ selectedOrgs }} </div> </div> <div ng-controller='secondController'> <div>PEOPLE:</div> <div> {{ selectedPeople }} </div> </div> </div> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM