Come ottenere l'elemento per nome classe o ID

Sto cercando di trovare l'elemento in html di angularjs.

Ecco l'html:

<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/>

Sto cercando di ottenere l'elemento del pulsante con più file di nome classe, quindi ho provato

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

Ma non funziona, e provato element.findma funziona solo per tag.

C'è qualche funzione che può ottenere l'elemento per id o nome classe in angularjs?

getElementsByClassNameè una funzione nel documento DOM. Non è né una funzione jQuery né una funzione jqLite.

Non aggiungere il periodo prima del nome della classe quando lo si utilizza:

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

Avvolgilo in jqLite (o jQuery se jQuery è caricato prima di Angular):

var wrappedResult = angular.element(result);

Se si desidera selezionare dalla elementfunzione di collegamento in una direttiva, è necessario accedere al riferimento DOM anziché al riferimento jqLite - element[0]anziché element:

link: function (scope, element, attrs) {

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

In alternativa è possibile utilizzare la document.querySelectorfunzione (è necessario il periodo qui se si seleziona per classe):

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

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

Non è necessario aggiungere un .in getElementsByClassName, cioè

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

Tuttavia, quando si utilizza angular.element, è necessario utilizzare i selettori di stile jquery:

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

dovrebbe fare il trucco.

Inoltre, da questa documentazione "Se jQuery è disponibile, angular.element è un alias per la funzione jQuery. Se jQuery non è disponibile, angular.element delega al sottoinsieme incorporato di Angular di jQuery, chiamato" jQuery lite "o" jqLite. ""

La risposta di @ tasseKATT è ottima, ma se non vuoi fare una direttiva, perché non usarla $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

Se vuoi trovare il pulsante solo con il nome della sua classe e usando solo jQLite, puoi fare come di seguito:

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

Spero che questo ti aiuti. :)