ionic-framework: [Bug] Can't place ion-refresher inside custom component

Ionic version: (check one with “x”) [ ] 1.x [x] 2.x

I’m submitting a … (check one with “x”) [x] bug report [ ] feature request [ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior: If I try to add ion-refresher to a custom component.

Parse Error: No provider for Content

Expected behavior: Although such behavior is not to be recommended, sometimes it is needed to place the ion-refresher inside a component, for example on my case: I have 3 lists which are identical in look and behavior, but with different content every time. So my list component should have virtual-scrolling, refresher, infinite-scroll etc in that one component.

Steps to reproduce: Place an ion-refresher inside a custom component and not in a page’s view directly

Related code:

<ion-refresher (ionRefresh)="refreshList($event)">
    <ion-refresher-content></ion-refresher-content>
</ion-refresher>

Other information: This is very similar to this problem: https://github.com/driftyco/ionic/issues/6531 And as such can be resolved with same solution in principal I believe: https://github.com/driftyco/ionic/pull/10507

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Your system information:

 ordova CLI: 6.4.0
Ionic Framework Version: 2.0.1
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v6.9.1
Xcode version: Not installed

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 11
  • Comments: 17 (2 by maintainers)

Most upvoted comments

Put your refresher and other tags to <ion-content></ion-content> like in example from docs

<ion-content>

  <ion-refresher (ionRefresh)="doRefresh($event)">
    <ion-refresher-content></ion-refresher-content>
  </ion-refresher>

</ion-content>

I can get you past this level but I haven’t beaten the game yet

@Component({
      selector: 'custom-list',
      templateUrl: 'custom-list.html',
      viewProviders:[Content]
})

Thanks @WilixLead but we can’t add another <ion-content> inside a component 😦

Thanks, we will look into this.

Experienced the same issue