zone.js:355 Unhandled Promise rejection: Template parse errors

[anil1712]

Hi,

I am using modal code as per the DOC, but getting below exception.

'modal-content' is not a known element:

1. If 'modal-content' is an Angular component, then verify that it is part of this module.
2. If 'modal-content' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("

<sm-modal title="MyForm" #MyForm>
[ERROR ->]
<form class="ui large form" (ngSubmit)="onSubmit()" #loginForm="ngForm" nova"): BannerHeaderComponent@26:4 ; Zone: ; Task: Promise.then ; Value: Error: Template parse errors:(…) Error: Template parse errors:
'modal-content' is not a known element:

1. If 'modal-content' is an Angular component, then verify that it is part of this module.
2. If 'modal-content' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("

[comoris]

+1

[alex88]

Same here, is it something new with angular?

[anil1712]

Yeah, Dont know. Nothing mentioed in DOC.

[alex88]

Anyway the CUSTOM_ELEMENTS_SCHEMA fix works, but probably it's just a way to ignore that warning

[anil1712]

And also how do I change the modal size? I needed small login modal.

[alex88]

Probably with a class on the modal

[anil1712]

Can you please provide any sample block code?

[alex88]

<sm-modal title="Hello from Modal" class="small large" #myModal>

[anil1712]

Thanks, the small is working.

Is anyone knows how to open the modal from angular conponent method. I mean I can provide a method name in click event but what code I need to write to open any modal ?

[alex88]

In your template

<sm-modal #editSupplierModal>

in your component

import { SemanticModalComponent } from 'ng-semantic';

@ViewChild('editSupplierModal') editSupplierModal: SemanticModalComponent;

...

this.editSupplierModal.show();

[anil1712]

Thanks, Its working.

[anil1712]

How to pass data in modal?
I want to show dynamic data in modal. Is there any way to pass variables while showing the data.

Like I want to bind the modal inside the *ngFor loop and want to show dynamic data in modal.

[alex88]

@anil1712 the modal is in the same scope as the main template, so you can use the same values you use in the component that includes the modal, otherwise, if you create a custom component for the modal, you pass data the same way you do with any other component

[anil1712]

Hi @alex88 ,

I have created new component for modal. So I need to share data from one component to another. I am using @angular/common": "~2.1.0. So can you please share me any link or send me any block of code to pass data from one component to another. Actually I am pretty new for angular2. Please help me to out of it.

Thanks,

[alex88]

Me too, so I don't really know what's the best way, maybe using input/outputs https://angular.io/docs/ts/latest/cookbook/component-communication.html