在AngularJS啓動一條指令後，不會調用$ watch

我正在嘗試調用模態指令中的某個元素的焦點。
調用該指令後，僅在第一次調用focus-me指令。
我嘗試在Plunker中顯示的對話框指令中添加focus-me元素。
下面是我正在嘗試的指令。

顯示模式對話框[工作]
顯示該對話框後我試圖把重點對話框[將我的焦點我添加的手錶元件指令]一個specfic元素
焦點只發生在第一次。
Plunker
請幫忙，如何觸發上述Plunker的指令上的watch元素。非常感謝。

下面是重點和對話框的指令代碼，我目前using.`

app.directive('focusMe', function($timeout, $parse) { 
    return { 
    link: function(scope, element, attrs) { 
     var model = $parse(attrs.focusMe); 
     scope.$watch(model, function(value) { 
     console.log('value=',value); 
     if(value === true) { 
      $timeout(function() { 
      element[0].select(); 
      element[0].focus(); 
      }); 
     } 
     }); 
     element.bind('blur', function() { 
     console.log('blur') 
     scope.$apply(model.assign(scope, false)); 
     }) 
    } 
    }; 
}).directive('modalDialog', function(){ 
    return { 
    restrict: 'AE', 
    scope: { 
     show: '=', 
    focusDesign:'=focusDesign' 
    }, 
    replace: true, 
    transclude: true, 
    link: function(scope, element, attrs) { 


     scope.dialogStyle = {}; 
     if (attrs.width) 
     scope.dialogStyle.width = attrs.width; 
     if (attrs.height) 
     scope.dialogStyle.height = attrs.height; 
     if (attrs.focusDesigniso) 
     scope.focusDesigniso=attrs.focusDesigniso; 
     scope.hideModal = function(focusDesign) { 
     scope.show = false; 
     focusDesigniso=false; 
      //$scope.focusDesign=false; 
     }; 
    scope.hideModalC = function() { 
     alert("I m in hide"); 
     scope.show = false; 
     }; 
    }, 
    template: "<div class='ng-modal' ng-show='show'><div class='ng-modal-overlay' ng-click='hideModal(focusDesign)' ng-model='focusDesign'></div><div class='ng-modal-dialog' ng-style='dialogStyle'><div class='ng-modal-close' ng-click='hideModal(focusDesign)' ng-model='focusDesign'>X</div><div class='ng-modal-dialog-content' ng-transclude></div></div></div>" 
    }; 
});

來源

2015-06-09 Vijay

這是因爲該指令還住在後臺它不得到重新啓動對焦的指令。你實際上不是重新啓動指令，你所做的是重新打開模態。因此，如果您想做任何事情，請與模式切換事件相關。例如，您可以通過rootScope廣播事件並將其捕獲到focusMe目錄中並重新運行焦點 – Tom

謝謝Tom。你能否介紹一下在rootScope上重新運行。我對這裏的指令範圍感到困惑。 – Vijay

https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$broadcast – Tom

我在指令中的問題的解決方案。
$ scope.apply我正在應用它的模型，而不是我應該用於焦點元素。
更新我抄在下面工作Plunker

app.directive('focusMe', function($timeout, $parse) { 
    return { 
    link: function(scope, element, attrs) { 
     var model = $parse(attrs.focusMe); 
     scope.$watch(model, function(value) { 
     console.log('value=',value); 
     if(value === true) { 
      $timeout(function() { 
      element[0].select(); 
      element[0].focus(); 
      }); 
     } 
     }); 
     element.bind('blur', function() { 

     scope.$apply(function() 
        { 
      attrs.focusMe=!attrs.focusMe; 
     }) 
     }) 

    } 
    }; 
});

Working Plunker

來源

2015-06-11 13:28:51 Vijay

謝謝男人，它真的幫助:) – Siddharth

在AngularJS啓動一條指令後，不會調用$ watch

回答

相關問題