angularjs - テンプレートなしの Angular コンポーネント式バインディング

Question

コンポーネントからスコープ データを出力しようとしていますが、ローカル テンプレートなしでそれを行う方法を理解するのに苦労しています。

さまざまな理由で、HTML ファイルにマークアップを含める必要があり、js ロードで解析されないようにする必要があります。

これはこれまでのダミーコードです: (codepen: http://codepen.io/anon/pen/qNBBRN )

HTML:

<comp>
  {{ $ctrl.testing }}
</comp>

動かない JS コード:

angular
      .module('Test', [])
      .component('comp', {
        controller: myCtrl,
      });

function myCtrl() {
  var model = this;
  model.testing = '123';
}

document.addEventListener('DOMContentLoaded', function() {
  angular.bootstrap(document, ['Test']);
});

そして、これは機能しますが、避けたいものです：

angular
  .module('Test', [])
  .component('comp', {
    controller: myCtrl,
    template: '{{ $ctrl.testing }}',
  });

function myCtrl() {
  var model = this;
  model.testing = '123';
}

document.addEventListener('DOMContentLoaded', function() {
  angular.bootstrap(document, ['Test']);
});