title: Vue.js dynamic component render "Failed to resolve directive"
body: <p>Currently I have solved things in an other way, but I am still curious why this is not working.</p>
  
  <p>I'm trying to render a transition with a template with 2 directives, but it seems it tries to resolve the attrs/props from an other scope, but I can't see why at this point. Perhaps I just made a stupid mistake.</p>
  
  <p>This gives me the error:
  "[Vue warn]: Failed to resolve directive: ..." for both bind and text</p>
  
  <pre><code>&lt;script&gt;
      import Step from './Step';
  
      export default {
          data() {
              return {
                  pointer: 0,
                  steps: [],
              }
          },
  
          render(createElement) {
              this.steps = this.$slots.default
                  .filter(vnode =&gt; vnode.tag &amp;&amp; vnode.tag.indexOf(Step.name) &gt; -1);
  
              this.pointer = this.steps[0].key;
  
              return createElement('div',
                  {},
                  [
                      createElement('transition',
                          {},
                          [
                              createElement('template', {
                                  directives: [
                                      {name: 'bind', arg: 'key', value: 'pointer'},
                                      {name: 'text', value: 'step'},
                                  ],
                              })
                          ]
                      )
                  ]);
          },
  
          computed: {
              step() {
                  return _.find(this.steps, step =&gt; step.key === this.pointer);
              }
          },
  
          methods: {
              next() {
                  ++this.pointer;
              }
          }
      }
  &lt;/script&gt;
  </code></pre>