angularjs - 无法将数据传递给 AngularJS 组件指令

Question

我正在尝试使用 AngularJS 1.5 创建一个组件指令。我将控制器中定义的 $scope 变量传递给组件指令。但它不是渲染。

这是组件指令：

.component('myComp', {
   scope: {},
   bindToController: {
       info: '=info'
   },

   template: [

       '<table<tr>',
       '<td>{{ $ctrl.info }}</td>',
       '</tr>',
       '</tbody>',
       '</table>'
   ].join('')

});

这是视图

<my-comp info="employee"></my-comp>

但是没有显示任何内容，浏览器控制台中也没有错误。

Answer 1

事情发生了变化——再次

组件现在忽略该bindToController属性。而是使用bindings.

.component('myComp', {
   //scope: {},

   //obsolete
   //bindToController: {

   //Use instead
   bindings: {       
       info: '=info'
   },

   template: [

       '<table<tr>',
       '<td>{{ $ctrl.info }}</td>',
       '</tr>',
       '</tbody>',
       '</table>'
   ].join('')

});

JSFiddle 上的DEMO

有关更多信息，请参阅AngularJS 开发人员指南 - 了解组件。

Answer 2

试试这个

.component('myComp', {
 restrict: 'AE',
 scope: {info: '='},
 template: [

   '<table<tr>',
   '<td>{{ info }}</td>',
   '</tr>',
   '</tbody>',
   '</table>'
 ].join('')
});