RC0/RC1 Directives cause build error when used on ion-content, ion-slides tags

Ionic Framework ionic-v3
1

I’ve updated to RC0 from beta11 and now my custom directives are not working.
I am using my custom directives in these cases:
<ion-slides [swipeG]="" …
<ion-content [profileOrientation]="" …
Directives are added to declarations and entryComponents of the module.

I am getting errors during “ionic build”:

Error: Template parse errors: 
[17:58:22]  Can't bind to 'profileOrientation' since it isn't a known property of 'ion-content'.
[17:58:22]  1. If 'ion-content' is an Angular component and it has 'profileOrientation' input, then verify 
that it is part of this module. 
[17:58:22]  2. If 'ion-content' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' 
of this component to suppress this message. 
[17:58:22]  (" 
[17:58:22]  <ion-content padding [ERROR ->][profileOrientation]="" class="auth" > 
[17:58:22]  "): AuthPage@19:21 
[17:58:22]  ngc failed 
[17:58:22]  ionic-app-script task: "build" 
[17:58:22]  Error: Error

The same error for
Update to 2.0.0-rc.1 not helped.

What could went wrong after migration with them?

ionic info
Cordova CLI: You have been opted out of telemetry. To change this, run: cordova telemetry on.
6.3.1
Ionic Framework Version: 2.0.0-rc.1
Ionic CLI Version: 2.1.1
Ionic App Lib Version: 2.1.1
Ionic App Scripts Version: 0.0.33
OS: Distributor ID:    Ubuntu Description:    Ubuntu 16.04.1 LTS 
Node Version: v6.8.1
2

@Chyzhov when you say not working, what do you mean exactly? Are you getting any console errors? Can you share your NgModule declaration?

3

Yeah, sorry, I will provide console error (updating my question)

4

Thanks, and can I see the NgModule declaration, or that whole file?

5 
import { NgModule } from '@angular/core';
import { IonicApp, IonicModule } from 'ionic-angular';
import { MyApp } from './app.component';
import { AuthPage } from '../pages/auth/auth';

import { ProfileOrientationDirective } from '../directives/profileOrientation.directive';
import { SwipeDirective } from '../directives/swipe.directive';
...

@NgModule({
    declarations: [
        MyApp,
        AuthPage,
        ProfileOrientationDirective,
        SwipeDirective
        ...
    ],
    imports: [
        IonicModule.forRoot(MyApp),
        HttpModule,
        TranslateModule.forRoot()
    ],
    bootstrap: [IonicApp],
    entryComponents: [
        MyApp,
        AuthPage,
        ProfileOrientationDirective,
        SwipeDirective
        ...
    ],
    providers: [....]
})
export class AppModule {}
6

Also, not clear what to use in “bootstrap”: IonicApp or MyApp (from app.component.ts)?
(first one cames from migration guide, the second looks more logical at this place). In both cases error is the same.

7

Finally, solved the problem by

  1. Removing directives from entryComponents
  2. Adding to my @NgModule like it is proposed in CUSTOM_ELEMENTS_SCHEMA added to NgModule.schemas
    schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
1 Like