Bu ne şekilde Açısal' AngularJS giriş alanına odaklanmak ayarlamak için?

Daha spesifik gereksinimleri:

1. Modal açıldığında, bu Mod içinde <input> önceden tanımlanmış bir odak ayarlayın.
2. Her <input> görünür (bazı butonu gibi), odağı haline gelir.

Bazı tarayıcılar () çalışmıyor Firefox örneğin sadece autofocus, ama bu tek Kalıcı ilk kez açıldığında çalışır, ve I tried to achieve the first requirement.

Herhangi bir yardım takdir edilecektir.

1. Kalıcı açıldığında, önceden tanımlı <ınput a^ odağı ayarlayın . bu Kalıcı içinde.

Bir Direktifi tanımlamak ve $tesisinde/öğe odaklanmak için zaman bilir, tetikleyici izle

Name: <input type="text" focus-me="shouldBeOpen">

app.directive('focusMe', function($timeout, $parse) {
  return {
    //scope: true,   // optionally create a child scope
    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].focus(); 
          });
        }
      });
      // to address @blesh's comment, set attribute value to 'false'
      // on blur event:
      element.bind('blur', function() {
         console.log('blur');
         scope.$apply(model.assign(scope, false));
      });
    }
  };
});

Plunker

$Zaman aşımı işlemek için kalıcı kilo vermek için gerekli görünmektedir.

2.'' Her &; giriş^ lt . görünür (bazı butonu gibi) olur, dizi odaklanmak.

Aslında yukarıdaki gibi bir Direktif oluşturun. Bazı kapsam özelliği izlemek ve gerçek (ng-click işleyicisi ayarlayın) olduğunda, element[0].focus() yürütme. Kullanım durumunda, bağlı olabilir veya $timeout bunun için bir ihtiyaç olmayabilir

<button class="btn" ng-click="showForm=true; focusInput=true">show form and
 focus input</button>
<div ng-show="showForm">
  <input type="text" ng-model="myInput" focus-me="focusInput"> {{ myInput }}
  <button class="btn" ng-click="showForm=false">hide form</button>
</div>

app.directive('focusMe', function($timeout) {
  return {
    link: function(scope, element, attrs) {
      scope.$watch(attrs.focusMe, function(value) {
        if(value === true) { 
          console.log('value=',value);
          //$timeout(function() {
            element[0].focus();
            scope[attrs.focusMe] = false;
          //});
        }
      });
    }
  };
});

Plunker

Güncelleme 7/2013: Birkaç kişi benim orijinal kapsamı direktifleri izole ve gömülü giriş alanları (örneğin, kalıcı bir giriş alanı) ile ilgili sorunlar var o zaman kullandığını gördüm. Yeni bir kapsam (ya da muhtemelen yeni bir alt kapsam) ile bir Direktif bazı ağrı hafifletmek. Yani yukarıdaki cevap kapsamları izole kullanmak için güncelledim. Aşağıda orijinal cevabı:

Orijinal 1. cevap, bir kapsam izole kullanarak:

Name: <input type="text" focus-me="{{shouldBeOpen}}">

app.directive('focusMe', function($timeout) {
  return {
    scope: { trigger: '@focusMe' },
    link: function(scope, element) {
      scope.$watch('trigger', function(value) {
        if(value === "true") { 
          $timeout(function() {
            element[0].focus(); 
          });
        }
      });
    }
  };
});

Plunker.

Orijinal 2. cevap, bir kapsam izole kullanarak:

<button class="btn" ng-click="showForm=true; focusInput=true">show form and
 focus input</button>
<div ng-show="showForm">
  <input type="text" focus-me="focusInput">
  <button class="btn" ng-click="showForm=false">hide form</button>
</div>

app.directive('focusMe', function($timeout) {
  return {
    scope: { trigger: '=focusMe' },
    link: function(scope, element) {
      scope.$watch('trigger', function(value) {
        if(value === true) { 
          //console.log('trigger',value);
          //$timeout(function() {
            element[0].focus();
            scope.trigger = false;
          //});
        }
      });
    }
  };
});

Plunker.

Yönetmelikte focusİnput özelliği/tetiği sıfırlamak için, '=', iki yönlü veri bağlama için kullanılır. İlk yönergede, '@' yeterli. Kullanarak '@' tetiği karşılaştırırız değer "" @ her zaman bir dize olur. yana doğru da unutmayın