Question

我正在尝试评估父控制器上的函数，然后将其发送到指令中。我需要摘要循环观察的值，并在用户更新时更新。

我已经解决了一些原始问题，但是在修改绑定时遇到了问题。

我有一个带有对象的控制器，以及一个检查对象是否有值的函数，它返回true或false：

   this.foo = {
    obj1: {
        name: '',
        time: 'time2'
    },
    obj2: {
        name: 'name2',
        time: 'time2'
    }
};


this.isPaneComplete = function(tab) {
    var complete = true;
    var tab2 = tab.tab;
    for (var prop in tab2) {
        if (tab2.hasOwnProperty(prop)) {
            complete = !!tab2[prop] && complete;
        }
    }
    return complete;
};

我有一个名为MyPane的指令，其范围为：

  scope: {
      completed : '&myPaneComplete'
    },

这是我的模板：

<my-pane my-pane-complete="gigEditCtrl.isPaneComplete({tab : gigEditCtrl.foo.obj1})">
<input type="text" placeholder="2014-12-31" ng-model="gigEditCtrl.foo.obj1.name">
<input type="text" placeholder="2014-12-31" ng-model="gigEditCtrl.foo.obj1.time">

运行以下console.log时，我的指令

中的TRUE或FAlSE

link: function(scope, element, attrs, tabsCtrl) {
          console.log(scope.completed());
        },

这一切都很棒。但是，当我更新输入框中的值时，控制器功能不会再次运行，并且不会触发console.log。思考？

Answer 1

您的问题的解决方案是在您的指令中使用$watch，它看起来像这样

testApp.directive('myDir', function(){
   return{
                scope:{
                    test: '&'
                },
                link: function(scope, el, attrs){
                    scope.$watch(scope.test, function(newValue){
                        console.log('from dir name =  '+ newValue);
                    });
                }
            };
 });

基本上你会使用$watch来观察你的函数返回值的变化。

我在这里为您设置了一个工作演示http://plnkr.co/edit/Gk2tILTql8NW1QkvVRRk?p=preview

Angular：评估控制器范围上的函数，然后将其传递给指令

1 个答案: