I am trying to do something really fundamental - add a custom component to ionic page. Entire code looks like below:
import {Page} from 'ionic-angular';
import {PropositionCard} from './PropositionCard';
@Page({
templateUrl: 'build/pages/swipe-page/swipe-page.html',
directives: [PropositionCard]
})
export class SwipePage {
}
inside the same directory in PropositionCard.ts
:
import { Component } from 'angular2/core';
@Component({
selector: 'proposition-card',
template: `<span>hello</span>`
})
export class PropositionCard {
}
and in the swipe-page.html
:
<ion-navbar *navbar>
<ion-title>swipePage</ion-title>
</ion-navbar>
<ion-content padding class="swipe-page">
<proposition-card>
</ion-content>
That’s all. Something really fundamental. When I run this code with ionic serve -c -s
I’m getting “white wall” in web browser. When I open chrome console all I see is:
(index):28 Uncaught TypeError: Cannot read property 'btn' of null http://localhost:8100/build/js/app.bundle.js Line: 58239
When I remove <proposition-card>
from swipe-page.html
everything works fine (of course this component is not displayed).
Is there anything wrong here? I’m running it with:
"angular2": "2.0.0-beta.15",
"ionic-angular": "2.0.0-beta.6",
"ionic-native": "^1.1.0",