Dapatkan fokus pada input anglejs yang tidak berfungsi

Saya mencoba membuat arahan fokus ketika saya membuka halaman dengan di dalam formulir pada teks input pertama yang diajukan. Ini adalah arahannya

app.directive("getFocus", function() {
    return {
        restrict: 'AC',
        link: function(scope, element){
            console.log("focus!");
            element.focus();
        }
    }
});

dan di masukan html saya

<input id="ss" data-ng-model="item.value" type="text" data-ng-class="{'get-focus': $first}">
<input id="tt" type="text" data-ng-model="item.value" data-ng-class="{'get-focus': $first}">

Saya menggunakan ng-class karena merupakan bentuk dinamis yang membuat perputaran json dan saya tidak tahu input mana yang dibuat pertama kali. Arahan itu sepertinya tidak berhasil. Faktanya, console.log tidak muncul di konsol.. Ada yang salah?


javascript focus angularjs
person Atlas91    schedule 12.03.2015    source sumber
comment
arahan kelas tidak akan berfungsi dengan ng-class. mereka hanya dapat digunakan dengan atribut kelas html.   -  person Vinay K    schedule 12.03.2015
comment
meskipun saya menggunakan batasan: 'AC'?   -  person Atlas91    schedule 12.03.2015
comment
Ya. Dalam kasus di atas, arahan getFocus akan ditambahkan berdasarkan suatu kondisi. Kita perlu mengkompilasi ulang node setelah kelas ditambahkan agar dapat berfungsi   -  person Vinay K    schedule 12.03.2015

Jawaban (1)


arrow_upward
1
arrow_downward

Saya punya masalah seperti itu dan saya berakhir dengan arahan ini

angular.module('myApp').directive('autofocusIf', function($timeout) {
return {
  restrict: 'A',
  scope: {
    autofocusIf: '&'
  },
  link: function($scope, $element) {
    $scope.$watch('autofocusIf', function(shouldFocus) {
      if (shouldFocus()) {
        $timeout(function() {
          $element[0].focus();
        });
      } else {
        $timeout(function() {
          $element[0].blur();
        });
      }
    });
  }
};
})

dan kemudian di html

<div ng-repeat="repeat in repeats">
  <input type="text" autofocus-if="$first" ng-model="myModel" />
</div>
person maurycy    schedule 12.03.2015
comment
Apakah Anda memiliki masukan di dalam ng-repeat, bisakah Anda membuat plunker? - person maurycy; 12.03.2015
comment
Oke saya akan.. Apakah ada masalah jika saya menggunakan uikit? - person Atlas91; 12.03.2015
comment
Saya rasa tidak, meskipun saya telah membuat plunker yang berfungsi untuk Anda plnkr.co/edit /ohJ62hl0rtNb1NNus9F6?p=pratinjau - person maurycy; 12.03.2015
comment
Saya rasa saya menemukan masalahnya..atau mungkin tidak..Anda telah menetapkan model-ng sebagai masukan.. dalam kasus saya, saya memiliki model-ng lain.. lihat hasil edit saya - person Atlas91; 12.03.2015
comment
adalah seperti ini: plnkr.co/edit/c0fyixdoAOmnYVilnFrO?p=preview dan di sini tidak berfungsi - person Atlas91; 12.03.2015
comment
Plunker itu berfungsi untuk saya, menurut saya model ng tidak menjadi masalah di sini - person maurycy; 12.03.2015
comment
yah..ini aneh :( - person Atlas91; 12.03.2015