代码之家 › 专栏 › 技术社区 › Rigoberto Ramirez Cruz

AngularJS中的双向数组绑定得到一个空集

angularjs-bindings angularjs-components angularjs

0

Rigoberto Ramirez Cruz · 技术社区 · 6 年前

我的父模板:

<custom-component c-data-source="vm.dataSource"></custom-component>

虚拟机数据源是一个字符串数组。

我的自定义组件:

.component('customComponent', {
  bindings: {
    cDataSource: '='
  },
  controller: function () {
    var vm = this;
    vm.data = [];
    vm.$onInit = onInit;

    function onInit() {
      vm.data = vm.cDataSource;
      console.log(vm);
    }
  },
  controllerAs: 'vm',
  template: `
     {{ vm.cDataSource | json }}
     {{ vm.data | json }}
  `
}

controller {cDataSource: Array(0), ...}
> cDataSource: (4) ['lorem', ...]

以及我的渲染子模板:

['lorem', ...]
[]

好像我在分配任务的时候vm.CDATA源到虚拟机数据集合是空的,但是当它打印出来时 虚拟机

我用的是AngularJS 1.5.0-rc.2。

1 回复 | 直到 6 年前

1

0

Kamlesh 6 年前

你能换一下吗

<custom-component c-data-source="vm.dataSource"></custom-component> 到 <custom-component c-data-source="dataSource"></custom-component>

    import angular from 'angular';
      var myMod = angular.module('plunker', []).controller('MainCtrl', function($scope) {
        $scope.DataSource=[1,3,4,5,6,7];
    });`

    myMod.component('customComponent', {
      bindings: {
        cDataSource: '='
      },
      controller: function () {
        var vm = this;
        vm.data = [];
        vm.$onInit = onInit;

        function onInit() {
          vm.data  = vm.cDataSource;
          vm.cDataSource = [1,3,4,5,6,7,8,9,10];
          console.log(vm); 
        }
      },
      controllerAs: 'vm',
      template:`
         {{ vm.cDataSource | json }} 

         {{ vm.data | json }}
      `
    });