Creating a tag input directive

Since recognizing hashtags within user input is not such a simple task, we're going to create a directive that helps us with that. This is actually our first directive that we're creating together! If you remember from Chapter 1Component-Based User Interfaces, directives are there to create custom behaviors without the need for an own view. Our tags input directive will collect and recognize hashtags from user input, but it does not actually render its own view.

Let's add two more interfaces to our model file in src/app/model.ts, to help us communicate hashtag user input:

export interface InputPosition {  top: number;  left: number;  caretOffset: number;}export interface HashTagInput {  hashTag: string; position: ...

Get Mastering Angular Components now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.