# Cannot add modal to my code

**URL:** <https://forum.ionicframework.com/t/cannot-add-modal-to-my-code/239725>\
**Category:** ionic-v3\
**Created:** [February 15, 2024, 4:32pm UTC](https://forum.ionicframework.com/t/cannot-add-modal-to-my-code/239725 "2024-02-15T16:32:25Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![cherry](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/cherry/32/149370_2.png) [@cherry](https://forum.ionicframework.com/u/cherry)\
**Post date:** [February 15, 2024, 4:32pm UTC](https://forum.ionicframework.com/t/cannot-add-modal-to-my-code/239725/1 "2024-02-15T16:32:25Z")

</div>

Hello, I am trying to add modal to my App but it doesn’t recognize the code.

My code:

> import { Component, ViewChild } from ‘@angular/core’;  
> import { IonModal } from ‘@ionic/angular’;  
> export class Tab1Page {  
> @ViewChild(IonModal) modal: IonModal;  
> })

![2024-02-15 17_29_28-● tab1.page.ts - baustelle - Visual Studio Code](https://global.discourse-cdn.com/ionicframework/original/3X/6/7/6763c5e1b96e0e5c0e4cc7ea013aebf60dfb5d96.png)

This code was taken out of the Ionic UI Components Guide.  
What am I missing here?

> **[ion-modal | Ionic Documentation](https://ionicframework.com/docs/api/modal#mounting-inner-contents)**
>
> ion-modal: Ionic Mobile App Custom Modal API Component

---

<div class="post-metadata">

**Author:** ![Hills90210](https://avatars.discourse-cdn.com/v4/letter/h/57b2e6/32.png) [@Hills90210](https://forum.ionicframework.com/u/Hills90210)\
**Post date:** [February 15, 2024, 4:38pm UTC](https://forum.ionicframework.com/t/cannot-add-modal-to-my-code/239725/2 "2024-02-15T16:38:19Z")

</div>

You shouldn’t be using viewChild. Scroll up to the top of the link you provided. It shows multiple different ways to implement a ion modal.

---

<div class="post-metadata">

**Author:** ![cherry](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/cherry/32/149370_2.png) [@cherry](https://forum.ionicframework.com/u/cherry)\
**Post date:** [February 15, 2024, 4:44pm UTC](https://forum.ionicframework.com/t/cannot-add-modal-to-my-code/239725/3 "2024-02-15T16:44:05Z")

</div>

This code solved it for me.

```auto
import { ModalController } from '@ionic/angular';
constructor(private modalCtrl: ModalController) {}

```
