发表于: 2017-01-25 11:26:22

2 1180


今天完成的事情:

萝卜多后台静态页;


又纠结了一波指令问题


成都小伙伴“最骚包”聚会;


明天计划的事情:

萝卜多公司编辑


遇到的问题:

指令写的有点儿繁杂,沁姐帮忙做了简化示范,可变参通过属性与directive内参数绑定;

想给directive内model 添加ng-change事件,change事件调用父controller内的函数vm.test(),调用参数为双向绑定的option,;

<picker options='vm.financingtype' ng-model="option" class="col-md-12" option-class="col-xs-11" ng-change="vm.test()"></picker>
scope:{
   options: '=',
   selectedValue: '=ngModel',
   selectName: '@',
   optionClass: '@',
   ngChange:'&'
  // ngChange:'&'
},
<select class="form-control" ng-model="selectedValue" ng-options="item.type as item.name for item in options" ng-change="ngChange()"></select>

1、直接通过ngChange:'&'调用父controller;

controller:

vm.test=function () {
   console.log($scope.option+ " in controller")
}

directive:

scope.dicrtiveTest=function () {
   console.log(''+c+'');
   console.log(scope.selectedValue+ " in directive");
   scope.ngChange();
   c++
}

结果:延迟输出,html页面输出的数值正确显示

2、$watch监控

directive:

scope.$watch('selectedValue',function (o,n) {
   o===n?'': console.log(''+c+''),console.log(scope.selectedValue+ " in directive"),scope.ngChange(),c++;
})

输出正常结果:

3.通过传入参数调用

scope.dicrtiveTest=function () {
   console.log(''+c+'');
   console.log(scope.selectedValue+ " in directive");
   scope.ngChange().test(scope.selectedValue);
   c++
}
vm.test=function () {
   return {
       test: function (a) {
           console.log(a + " in controller")
       }
   }
}

输出正常结果


收获:

如上


返回列表 返回列表
评论

    分享到