將焦點設置在指示

Question

我與一個行內編輯指令的形式在這裏進行試驗：http://icelab.com.au/articles/levelling-up-with-angularjs-building-a-reusable-click-to-edit-directive/

我想知道如何設置的，當我點擊了一些被創建的文本框中光標要編輯的文本。

下面是一些小的改動模板中的指令：

.directive("clickToEdit", function() { 
    var editorTemplate = '<div class="click-to-edit">' + 
     '<div ng-hide="view.editorEnabled" ng-click="enableEditor()">' + 
      '{{value}} ' + 
     '</div>' + 
     '<div ng-show="view.editorEnabled">' + 
      '<input ng-model="view.editableValue" ng-blur="save()">' + 
     '</div>' + 
    '</div>'; 

    return { 
     restrict: "A", 
     replace: true, 
     template: editorTemplate, 
     scope: { 
      value: "=clickToEdit", 
     }, 
     controller: function($scope) { 
      $scope.view = { 
       editableValue: $scope.value, 
       editorEnabled: false 
      }; 

      $scope.enableEditor = function() { 
       $scope.view.editorEnabled = true; 
       $scope.view.editableValue = $scope.value; 
      }; 

      $scope.disableEditor = function() { 
       $scope.view.editorEnabled = false; 
      }; 

      $scope.save = function() { 
       $scope.value = $scope.view.editableValue; 
       $scope.disableEditor(); 
      }; 
     } 
    }; 
}); 

Answer 1

你需要添加像這樣的鏈接功能：

link : function(scope, ele, attrs) { 
     scope.$watch('view.editorEnabled', function(n, o) { 
      if(n) ele.find('input')[0].focus(); 

     }) 
}