Cara mendapatkan elemen dengan nama kelas atau id

Saya mencoba menemukan elemen dalam html oleh angularjs.

Ini html-nya:

<button class="btn btn-primary multi-files" type="button">
   <span>Choose multiple files</span>
</button>
<br/><br/>
<input ng-file-select type="file" multiple  style="display: none"/><br/>

Saya mencoba untuk mendapatkan elemen tombol dengan nama kelas multi-file, lalu saya mencoba

var multibutton = angular.element(element.getElementsByClassName(".multi-files"));

Tetapi itu tidak berhasil, dan mencoba element.findtetapi hanya berfungsi untuk tag.

Apakah ada fungsi yang bisa mendapatkan elemen dengan id atau classname di angularjs?

getElementsByClassNameadalah fungsi pada Dokumen DOM. Ini bukanlah fungsi jQuery atau jqLite.

Jangan tambahkan titik sebelum nama kelas saat menggunakannya:

var result = document.getElementsByClassName("multi-files");

Bungkus dengan jqLite (atau jQuery jika jQuery dimuat sebelum Angular):

var wrappedResult = angular.element(result);

Jika Anda ingin memilih dari elementfungsi link in a directive, Anda perlu mengakses referensi DOM alih-alih referensi jqLite - element[0]alih - alih element:

link: function (scope, element, attrs) {

  var elementResult = element[0].getElementsByClassName('multi-files');
}

Alternatifnya Anda dapat menggunakan document.querySelectorfungsi (perlu titik di sini jika memilih berdasarkan kelas):

var queryResult = element[0].querySelector('.multi-files');
var wrappedQueryResult = angular.element(queryResult);

Demo: http://plnkr.co/edit/AOvO47ebEvrtpXeIzYOH?p=preview

Anda tidak perlu menambahkan .di getElementsByClassName, yaitu

var multibutton = angular.element(element.getElementsByClassName("multi-files"));

Namun, saat menggunakan angular.element, Anda harus menggunakan pemilih gaya jquery:

angular.element('.multi-files');

harus melakukan triknya.

Juga, dari dokumentasi ini, "Jika jQuery tersedia, angular.element adalah alias untuk fungsi jQuery. Jika jQuery tidak tersedia, angular.element mendelegasikan ke subset bawaan jQuery Angular, yang disebut" jQuery lite "atau" jqLite. ""

@tasseKATT's Answer is great, but if you don't want to make a directive, why not use $document?

.controller('ExampleController', ['$scope', '$document', function($scope, $document) {
  var dumb = function (id) {
  var queryResult = $document[0].getElementById(id)
  var wrappedID = angular.element(queryResult);
  return wrappedID;
};

PLUNKR

Jika Anda ingin mencari tombol hanya dengan nama kelasnya dan menggunakan jQLite saja, Anda dapat melakukan seperti di bawah ini:

var myListButton = $document.find('button').filter(function() {
    return angular.element(this).hasClass('multi-files');
});

Semoga ini membantu. :)