Angularjs 设置指令模板中使用的文本框的焦点

我使用指令显示基于数据模型的文本框。如果数据模式处于编辑状态，则显示文本框。我希望文本框的焦点应该在渲染时设置。我试过了，但什么也找不到。请帮忙。下面是一个供审查的示例

var myModule = angular.module('myModule', []);
myModule.directive('textbox', function() {
  return {
    restrict: 'E',
    replace: true,
    template: '<div ng-if="data.mode==edit"> <input type="text" ng-model="data.value"/> </div>',
    link: function (scope, element, attrs) 
    {
      scope.data =  {"mode":"edit","value":"This is text box"};
    }
  };
});

var myModule=angular.module（'myModule'，[]）；
指令（'textbox'，函数（）{
返回{
限制：'E'，
替换：正确，
模板：“”，
链接：函数（范围、元素、属性）
{
scope.data={“模式”：“编辑”，“值”：“这是文本框”}；
}
};
});

---

这样就可以了

scope.$watch('data.mode', function(newValue, oldValue) {
  if (newValue == 'edit') {
    element.find('input')[0].focus();
  }
});

---

我的JSFIDLE URL输入错误…我总是错误地在post中添加URL…下面是相同的URL