Angular 组件未将值发送回父组件

Angular 组件未将值发送回父组件,angular,eventemitter,Angular,Eventemitter,我的一个组件出现了问题,问题是当模型更改时,它似乎不会发出模型。它适用于我的其他组件,但对于这个组件,无论我做什么都不起作用 选择组件: import {Component, Input, Output, EventEmitter, OnInit, DoCheck} from 'angular2/core'; @Component({ selector: 'form-select', templateUrl: './app/assets/scripts/modules/form-con

我的一个组件出现了问题,问题是当模型更改时,它似乎不会发出模型。它适用于我的其他组件,但对于这个组件,无论我做什么都不起作用

选择组件:

import {Component, Input, Output, EventEmitter, OnInit, DoCheck} from 'angular2/core';

@Component({
  selector: 'form-select',
  templateUrl: './app/assets/scripts/modules/form-controls/form-select/form-select.component.html',
  styleUrls: ['./app/assets/scripts/modules/form-controls/form-select/form-select.component.css'],
  inputs: [
    'options',
    'callback',
    'model',
    'modelProperty',
    'optionProperty',
    'disabled',
    'allowEmpty',
    'label'
  ]
})

export class FormSelectComponent implements OnInit, DoCheck {
  @Input() model: any;
  @Output() onModelChange: EventEmitter<any> = new EventEmitter();

  private isOpen: boolean = false;
  private previousModel: any = null;

  ngOnInit() {

    // If no model is set and the select shouldn't be allowed empty, set the model to the first option
    if (!this.model && !this.allowEmpty) {
      this.model = this.options[0];
    }
    // If it should be allowed empty, set it to null which will add an empty class in the markup
    else if (this.allowEmpty) {
      this.model = null;
    }
  }

  ngDoCheck() {

    // Check if the model changes and emit it if it does
    if (this.previousModel !== this.model) {
      this.onModelChange.emit(this.model);
    }

    this.previousModel = this.model;
  }

  toggle() {

    if (this.disabled) {
      this.isOpen = false;

      return false;
    }

    this.isOpen = !this.isOpen;
  }

  close() {
    this.isOpen = false;
  }

  select(option) {
    this.model = option;
    this.close();

    this.callback ? this.callback() : false;
  }

  isSelected(option) {
    return option[this.modelProperty] === this.model[this.modelProperty];
  }
}
<div class="col-xs-12 m-b-xxs">
  <pre>{{user.country}}</pre>
  <form-select [(model)]="user.country" modelProperty="country" [options]="countries" optionProperty="country" label="Country"></form-select>
</div>

我做错了什么?

@Output() modelChange: EventEmitter<any> = new EventEmitter();
@Output()onModelChange:EventEmitter=neweventemitter();
应该是

@Output()modelChange:EventEmitter=neweventemitter();

对于速记双向绑定语法,
[(…)]
属性的名称(输入和输出)需要相同,除了输出的
Change
后缀。

但这只是一个名称。。?反过来也不行,这很奇怪。。只要再试一次就行了。我从一开始就喜欢
modelChange
,但我认为onModelChange听起来更好,我在哪里可以找到关于它的信息?它不仅仅是一个名字。这个名字意义重大。请参阅我的最新答案。如果您不希望对类的属性名称强制执行此限制,可以将名称传递给装饰器,如
@Input('model')myModel
@Output('modelChange')fancyName但在其他组件中,我有一个名为
onLogin
的输入,例如,然后是输出
onLogin
,它仍然会发出一个值。这是一个函数,因此可能不适用相同的规则。那么,为什么我需要
Change
后缀呢?因为我也将模型传递给其他组件,所以我需要它是同一个实例。。我将发布一个新问题。
@Output() modelChange: EventEmitter<any> = new EventEmitter();