শ্রেণি নাম বা আইডি দ্বারা কীভাবে উপাদান পাবেন get

125

আমি এঙ্গুলারজ দ্বারা এইচটিএমএল এ উপাদানটি সন্ধান করার চেষ্টা করছি।

এইচটিএমএল:

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

আমি ক্লাসের নাম মাল্টি-ফাইলগুলি দিয়ে বোতামের উপাদানটি পাওয়ার চেষ্টা করছি, তারপরে আমি চেষ্টা করেছি

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

তবে এটি কাজ করে না, এবং চেষ্টা করে element.findতবে এটি কেবল ট্যাগের জন্যই কাজ করে।

এমন কোন ফাংশন রয়েছে যা কৌণিক সংক্রান্ত আইডি বা শ্রেণিকাম দ্বারা উপাদান পেতে পারে?

angularjs

— জাস্টিন
সূত্র

হয়তো এই সাহায্য করে: stackoverflow.com/questions/20801843/...

— Wim Deblauwe

আপনাকে কোনও নির্দেশিকা তৈরি করতে হবে না .. আপনি কেবল এনজি-ক্লিকের মতো হ্যান্ডলার যুক্ত করতে পারেন। সবচেয়ে খারাপ ক্ষেত্রে, আপনি যদি সত্যিই উপাদানটি পেতে চান তবে আপনি সর্বদা jQuery সিনট্যাক্স ব্যবহার করতে পারেন।

— লুকাস হল্ট

187

getElementsByClassNameএটি ডিওএম ডকুমেন্টের একটি ফাংশন। এটি একটি jQuery বা jqLite ফাংশন না।

শ্রেণীর নামের আগে সময়টি ব্যবহার করার সময় যুক্ত করবেন না:

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

এটিকে জকিএলাইটে মুড়িয়ে দিন (বা জিকুয়েরি যদি কৌনিকের আগে লোড করা থাকে):

var wrappedResult = angular.element(result);

আপনি যদি elementকোনও নির্দেশকের লিঙ্ক ফাংশনটিতে থেকে নির্বাচন করতে চান তবে আপনাকে jqLite রেফারেন্সের পরিবর্তে DOM রেফারেন্সটি অ্যাক্সেস করতে হবে - এর element[0]পরিবর্তে element:

link: function (scope, element, attrs) {

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

বিকল্পভাবে আপনি document.querySelectorফাংশনটি ব্যবহার করতে পারেন (শ্রেণি দ্বারা নির্বাচন করা হলে এখানে সময় প্রয়োজন):

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

ডেমো: http://plnkr.co/edit/AOvO47ebEvrtpXeIzYOH?p= পূর্বরূপ

— tasseKATT
সূত্র

1

এটি লক্ষণীয় যে লিঙ্ক ফাংশনের অভ্যন্তরে এলিমেন্ট.চাইল্ডিলমেন্টাউন্ট 0 হতে পারে কারণ কৌণিক এখনও উপাদান তৈরি করার সুযোগ পায়নি, সুতরাং আপনাকে উপাদান [0]। ।

— Dylanthepiguy

27

আপনি একটি যোগ করতে হবে না .মধ্যে getElementsByClassName, অর্থাত্

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

যাইহোক, ব্যবহার করার সময় angular.element, আপনি jquery শৈলী নির্বাচক ব্যবহার করতে হবে:

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

কৌতুক করা উচিত।

এছাড়াও, এই ডকুমেন্টেশন থেকে "যদি jQuery উপলভ্য থাকে তবে কৌণিক.এলিমেন্টটি jQuery ফাংশনের জন্য একটি উপনাম। ""

— Ashesh
সূত্র

হাই, উত্তরের জন্য ধন্যবাদ, আমি চেষ্টা করেছিলাম, তবে ত্রুটিটি অপরিজ্ঞাত ফাংশন বলে

— জাস্টিন

হ্যাঁ, এটি সম্ভবত কাজ করে নাও পারে। দয়া করে এখনই আমার উত্তরটি পরীক্ষা করুন (একটি সম্পাদনা করেছেন) এবং সম্ভবত আপনি কী করবেন তা জানেন।

— আশেশ

যদি ফাংশনটি অপরিজ্ঞাত হয় তবে আপনি সম্ভবত jquery লোড করেন নি। jqlite (যা আপনি @ আকাশের উল্লিখিত হিসাবে jquery লোড না করলে ব্যবহৃত হয়) jquery এর যাবতীয় ফাংশন নেই, এবং getElementsByClassName এর মধ্যে একটি।

— হাইমলিট

5

angular.element ( 'বহু-ফাইল'); কাজ করবে না আপনার পিরিয়ড লাগবে

— ফিলিপ জিওসিফি

var মাল্টবুটন = কৌণিক.এলিমেন্ট (ডকুমেন্ট.জেট এলিমেন্টসওয়াই ক্লাসনাম ("মাল্টি-ফাইলগুলি"));

— সালমান লোন

20

@ তাসকেটটির উত্তর দুর্দান্ত তবে আপনি যদি কোনও নির্দেশনা তৈরি করতে না চান তবে কেন ব্যবহার $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

— আরি
সূত্র

2

angular.element('#Your element id')একই কাজ করে।

— গ্যাবলার

3

এটি এই ত্রুটিটি কৌণিক 1.5.8 এ দিচ্ছে। "নির্বাচকদের মাধ্যমে উপাদানগুলি অনুসন্ধান করা জেকিলাইট সমর্থন করে না"

— এসপি সিং

-4

আপনি যদি কেবল তার শ্রেণীর নাম এবং কেবল জকিউকিউল ব্যবহার করে বাটনটি সন্ধান করতে চান তবে আপনি নীচের মত করতে পারেন:

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

আশাকরি এটা সাহায্য করবে. :)

— দেবায়ন দাস
সূত্র

1

এটি কৌণিক এবং jquery ব্যবহার করে না, এছাড়াও ভুল স্ট্যাটমেন্ট, আপনি প্রকৃতপক্ষে jqlite প্রতিস্থাপন jquery ব্যবহার করতে পারেন। ভ্যানিলা জাভাস্ক্রিপ্ট উপাদান ($ নথি [0]) এ না গিয়ে কৌণিক পরিবেশে এটি করার সঠিক উপায়।

— ডেনিস বার্টলেট