AngularJS $emit.$查询

AngularJS $emit.$on query

Plunker 来了:- http://plnkr.co/edit/JaEi7ftnokYhdvBn4fRh?p=preview 我已经发出数据,它在 data.name.

下的 $on() 中可用

但是,我无法使用 {{ dumbevent1_name }} 在 UI 中显示 $scope.dumbevent1_name 我做错了什么?

代码:-

// 代码在此处

angular.module('myapp', [])
.controller('mycontroller', mycontroller)
.component('semantic3', { // semantic3
    restrict: 'E',
    transclude: true,
    template: `<h6> imsemantic3</h6> <div ng-transclude></div>
              `,
    controller: semantic3Controller,          
  })
.component('semantic2', { // semantic2
    scope: {},
    restrict: 'E',
    transclude: true,
    template: `<h6> imsemantic2</h6> <div ng-transclude></div>
              `,
  })
.component('semantic1', { // semantic1
    scope: {},
    restrict: 'E',
    transclude: true,
    template: `<h6> imsemantic1</h6> <div ng-transclude></div>
              `,
  })
.component('dumbCompDisplayNames', {
    scope:true,
    restrict: 'E',
    template: `<h6>h6dumb1</h6> {{$ctrl.names}}`,
    bindings:{
      names : '<' //one-way data binding
    },
    controller: dumbController,
});


function semantic3Controller($scope, $element, $attrs){
  var self = $scope;
  $scope.$on('dumbevent1', function(event, data){
    console.log(data.name); //works. received.
    self.dname = data.name;
    $scope.dumbevent1_name = data.name; //works
    // console.log($scope.dumbevent1_name); //works
    // capturename( data); //works
  }); 
    // console.log($scope.dumbevent1_name); //doesnt work.
  // function capturename(x){
  //   $scope.dumbevent1_name = x.name; 
  //   console.log($scope.dumbevent1_name); //works  
  // }

}


function dumbController($scope, $element, $attrs){
  // console.log($scope); //works. these r NOT positional injection
  // console.log($element);
  // console.log($attrs);

  $scope.$emit('dumbevent1', {name: 'namedumb1'});
}

// main controller
function mycontroller(){
  console.log('i am mycontroller');
}

浪费在反复评论上的时间在某种程度上是值得的??如果没有时间看 plunker,请不要浪费时间发表评论。就像我说的,我解决了这个问题。