在Angular-Cli中，@Input和@Output始终是未定义的

在Angular-Cli中，@Input和@Output是Angular框架中用于组件之间进行数据传输和通信的装饰器。

@Input装饰器用于标记一个属性，使其可以接受来自父组件的值。通过在父组件中绑定属性值到子组件的标签上，子组件就可以接收到父组件传递过来的值。这样可以实现父子组件之间的数据传输。

@Output装饰器用于标记一个属性，并将其包装为一个事件发射器。它使子组件能够触发一个自定义事件并向父组件传递数据。父组件可以在模板中监听子组件的自定义事件，并在事件被触发时执行相应的逻辑。

@Input和@Output的使用可以实现组件之间的双向数据绑定和通信，增加了组件的灵活性和复用性。

在Angular-Cli中，@Input和@Output并不需要额外引入任何库或模块，它们是Angular框架的内置功能。

以下是@Input和@Output的用法示例：

在子组件中：

import { Component, Input, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'child-component',
  template: `Child Component`
})
export class ChildComponent {
  @Input() inputProperty: any;
  @Output() outputEvent: EventEmitter<any> = new EventEmitter<any>();

  triggerEvent() {
    this.outputEvent.emit('Hello from child component!');
  }
}

在父组件中：

<child-component [inputProperty]="parentData" (outputEvent)="handleOutput($event)"></child-component>

import { Component } from '@angular/core';

@Component({
  selector: 'parent-component',
  template: `
    <child-component [inputProperty]="parentData" (outputEvent)="handleOutput($event)"></child-component>
    Parent Component
  `
})
export class ParentComponent {
  parentData: any;

  handleOutput(data: any) {
    console.log(data);
  }
}

在这个示例中，父组件通过绑定属性[inputProperty]传递数据给子组件的inputProperty属性，子组件接收到父组件传递过来的值。子组件通过触发outputEvent自定义事件并传递数据，父组件通过监听(outputEvent)并执行handleOutput()方法来处理子组件传递过来的数据。

腾讯云相关产品和产品介绍链接地址：