Custom directives not showing in emulator


#1

Hey!
I have some custom directives that works fine in the browser when developing… But when running the emulator (ios) I can’t see them?

Did try making then display: block; but that was not the issue :smile:

Any help is most welcome!

EDIT: Just tried running “ionic run --livereload” and then I do see my custom directives?

HTML:

<div class="list card">
  <div class="item">
    <div class="row">
      <div class="col">
        <h2>#1</h2>
      </div>
      <div class="col col-75">
        <h2>{{vm.random.name}}</h2>
        <p>B-Day: 17 Feb</p>
      </div>
    </div>
  </div>
</div>

JS:

(function() {
  'use strict';

  angular
    .module('starter')
    .directive('randomName', randomName);

  function randomName() {
    var directive = {
      restrict: 'EA',
      templateUrl: '/components/randomName/randomName.template.html',
      scope: {},
      link: linkFunc,
      controller: Controller,
      controllerAs: 'vm',
      bindToController: true
    };

    return directive;

    function linkFunc(scope, el, attr, ctrl) {

    }
  }

  Controller.$inject = ['Names'];

  function Controller(Names) {
    var vm = this;

    activate();

    function activate() {
      Names.getRandomName(function(randomName) {
        console.log('Got random name');
        vm.random = randomName[Math.floor(Math.random()*randomName.length)];
      });
    }
  }
})();

#2

Ok so I guess I found the problem…
When using my directive as a tag, not working, how ever if I use it as a attribute it works… :confused:

So…

:+1: Works: <div my-directive></div>

:-1: Dont work: <my-directive></my-directive>

Anyone knows if this will ever work?


#3

Now on to the next problem… while this works in the emulator it fails to work when uploaded and viewed in ionic-view app…

Any ideas?


#4

Afaik this already works. Here is an example directly from one of the starters:

You can see here how it is used:

Try it yourself: $ ionic start myApp maps


#5

Yepp… it works in the emulator… but not when I do “iconic upload”… so if I use ionic-view it is not working for me :confused:


#6

Was this ever figured out @Mackelito ? I can’t get my directives to show up on the emulator or on a device


#7

Hmmm… if my memory serves me correct I needed to add display: block in my css to the custom element…