元件型指令 (Component)

說明

1. 該元件是下層元件，並且必須有Template
2. 在上層的元件Template中可以使用該下層元件directive
3. 在該下層元件的Metadata中設定selector屬性
4. selector屬性的值，代表該元件在上層元件Template中的directive名稱

Template語法：

<下層元件selector名稱></下層元件selector名稱>

程式碼範例：

1.在下層元件Component.ts的Metadata中設定selector屬性

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

@Component({
  selector: 'example-component',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent implements OnInit {

  callPhone(element){
    console.log(element);
  }

  constructor() { }

  ngOnInit() {
  }

}

2.在上層元件Template使用下層元件selector名稱作為directive

<example-component></example-component>