angular 组件之间传值

/**
 * Created by Administrator on 2017/8/28.
 */
var app =angular.module('app',[]);
app.directive('food',function () {
    return {
        restrict:"E",
        scope:[],
        controller:function($scope){
            $scope.foods=[];
            this.addApple=function () {
                $scope.foods.push("apple");
            }
            this.addOrange=function () {
                $scope.foods.push("orange");
            }
            this.addBanana=function () {
                $scope.foods.push("banana");
            }
        },
        link:function ($scope,element,attrs) {
            element.bind("mouseenter",function () {
                console.log($scope.foods)
            });
        }
    }
});
app.directive('apple',function () {
    return {
        require:'food',
        link:function($scope,element,attrs,foodCtrl){
            foodCtrl.addApple();
        }
    }
});
app.directive('orange',function () {
    return {
        require:'food',
        link:function($scope,element,attrs,foodCtrl){
            foodCtrl.addOrange();
        }
    }
});
app.directive('banana',function () {
    return {
        require:'food',
        link:function($scope,element,attrs,foodCtrl){
            foodCtrl.addBanana();
        }
    }
});


app.directive('hello',function(){
    return {
        restrict:"E",
        replace:true,
        template:'
{{txt}}
',
        link:function($scope,element,attrs){
            $scope.$watch('txt',function(newVal,oldVal){
                if(newVal==="error"){
                    console.dir(element);
                    element.attr("style","border:solid 1px red");
                }else{
                    element.attr("style","");
                }
            });
        }
    }
});


app.controller('OneSelfController',function($scope){
    $scope.clkme=function(){
        $scope.$broadcast('sendChild','我给子控制器传递数据');
        $scope.$emit('sendParent','冒泡到父元素')
    }
}).controller('ParentController',function($scope){
    $scope.$on('sendParent',function(event,data){//监听在子控制器中定义的 sendParent 事件
        console.log('OneSelfController传过来的',data,event.name,event);//事件名称：sendParent
    });
    $scope.clkP=function(){
        $scope.$broadcast('sendAllChild','让siblingsController接收到');
    }

}).controller('ChildController', function($scope){
    $scope.$on('sendChild', function(event,data) {//监听在子控制器中定义的 sendChild 事件
        console.log('ChildCtrl', data,event.name,event);// 事件名称：sendChild
    });
}).controller('siblingsController', function($scope){
    $scope.$on('sendAllChild',function(event,data) {
        console.log('值过来吧', data);
    });
    //下面事件不会触发
    $scope.$on('sendParent', function(event,data) {
        console.log('平级得不到值', data);
    });
    $scope.$on('sendChild', function(event,data) {
        console.log('平级得不到值', data);
    });
});

 

转载于:https://www.cnblogs.com/guozhe/p/7462281.html