1

I'm working on a project using Ionic, so I'm also using Angular 1. I don't know this framework well (I really prefer what Google have done with Angular 2 :-)).

Basically, I just want to create a new HTML element (a directive) and use it inside a view of my ionic app.

Here is how I declare my directive :

app.directive('smLocationSheet', function() {
   return {
      restrict: 'E',
      transclude: true,
      replace: true,
      scope: {},
      templateUrl: './locationSheet.html'
   }
});

I have a very basic and static HTML template and some SCSS but that's not important. Inside my home.html, I would like to use my directive like this :

<ion-view id="homeView" style="position: static !important;" view-title="Accueil" ng-init="init()">
    <ion-content class="has-tabs">
        <div id="map" data-tap-disabled="true"></div>
        <sm-location-sheet></sm-location-sheet>
    </ion-content>
</ion-view>

My js file describing the directive is well loaded but my directive doesn't 'render'. During debugging, I can see the html tag sm-location-sheet but no template. Also, it should be replaced by my hmtl file.

Clément Flodrops
  • 1,114
  • 1
  • 13
  • 29
  • Are you sure template is loaded, no 404 in network tab? Directive is registered in the same angular module? Do you get into link function, put debugger there? – dfsq Apr 10 '16 at 15:13
  • Sorry, my bad. Indeed my template file isn't loaded. `Failed to load template: ./locationSheet.html (HTTP status: 0 )`. Also, I don't have declared an angular module other than my `app`. The path to the html file is right – Clément Flodrops Apr 10 '16 at 15:19

1 Answers1

0

Well, thanks to dfsq, I've found my problem. The template wasn't loaded. Here is some usefull links to understand why (especially with ionic :)) :

Couldn't load template using templateUrl in Angularjs

AngularJS Failed to load template

Community
  • 1
  • 1
Clément Flodrops
  • 1,114
  • 1
  • 13
  • 29