Angular 未从哑组件获取事件

我无法从dumb组件获取事件。我认为它正在工作，但没有将事件绑定到智能组件。输出正常，但当我更改事件的值时，该值不起作用，并且没有显示错误

//planet-data.component.html（智能组件）

//下拉菜单：menu.component.html（哑组件）

//planet-view.component.html（另一个哑组件）

{{pic.earth_date}

{{title}}

您没有在

PlanetViewComponent

中发出

选中的
事件。所选的实际
事件是从
DropdownMenuComponent
引发的。如果您不从
PlanetViewComponent
发出
selected
事件，则无法在
PlanetDataComponent
中收听该事件

行星视图.component.html的代码

<div *ngIf="pics">
  <div *ngFor="let pic of pics.photos">
    <div class="card" style="width: 16rem;">
      <img class="card-img-top" src="{{pic.img_src}}" alt="Card image cap" routerLink="/detail">
      <p>{{pic.earth_date | date}}</p>
    </div>
  </div>
  <!-- Added catching (selected) event -->
  <app-dropdown-menu (selected)="selected.emit($event)"></app-dropdown-menu>
</div>

请共享该场景的stackblitz url。这将有助于其他人更好地理解代码。谢谢，但是我遇到了stackblitz的问题，stackoverflow的问题都不能解决这个问题。所以我在上面。然后我将分享我的项目，我只是把它放在github中。我真的不知道我是否在正确的嵌套组件中使用了输出，我尝试了很多方法。这是我的应用程序，尽管它在Stackblitz中不工作（它在本地工作，我甚至尝试了stackoverflow发布的关于它的问题）。添加了答案，请检查一下。代码在中可用。看来我在stackblitz中一次又一次地犯了同样的错误。不管怎样，感谢它在本地工作。我可以注意到，它的另一个工作原理是在planet-data.component.html中放置嵌套组件，代码是：
。谢谢你的时间
onSelect(event: Cam) {
    if (event.name === 'CHEMCAM') {
      this.loading = true;
      this.getCamType();
    } else {
      this.loading = true;
      event.name === 'NAVCAM' ? this.getCamType('spirit', 'navcam') : this.getCamType('opportunity', 'fhaz');
    }
  }

<p-dropdown [options]="cameras" [(ngModel)]="selectedCam" placeholder="Select a Cam" optionLabel="name"
            (ngModelChange)="getDisplayCam($event)">
</p-dropdown>

getDisplayCam(event: Cam) {
    this.selected.emit(event);
  }

<div *ngIf="pics">
  <div *ngFor="let pic of pics.photos">
    <div class="card" style="width: 16rem;">
      <img class="card-img-top" src="{{pic.img_src}}" alt="Card image cap">
      <p>{{pic.earth_date | date}}</p>
    </div>
  </div>
  <h4>{{title}}</h4>
  <app-dropdown-menu></app-dropdown-menu>
</div>

<div *ngIf="pics">
  <div *ngFor="let pic of pics.photos">
    <div class="card" style="width: 16rem;">
      <img class="card-img-top" src="{{pic.img_src}}" alt="Card image cap" routerLink="/detail">
      <p>{{pic.earth_date | date}}</p>
    </div>
  </div>
  <!-- Added catching (selected) event -->
  <app-dropdown-menu (selected)="selected.emit($event)"></app-dropdown-menu>
</div>

@Component({
  selector: 'app-planet-view',
  templateUrl: './planet-view.component.html',
  styleUrls: ['./planet-view.component.sass']
})
export class PlanetViewComponent implements OnInit {

  @Input() pics: Photo;

  // Added @Output() event
  @Output() selected = new EventEmitter<Cam>();
  constructor() {}

  ngOnInit() {
  }
}