প্রোগ্রামিংভাবে এনজি-ক্লিক কীভাবে ট্রিগার করবেন


101

আমি ng-clickরানটাইমের সময় কোনও উপাদানটির ট্রিগার করতে চাই:

_ele.click();

অথবা

_ele.trigger('click', function());

কিভাবে এই কাজ করা যেতে পারে?


4
না, আমি সেই প্রক্রিয়াটি জানতে চাই যার মাধ্যমে আমি এনজি-ক্লিক ম্যানুয়ালি ট্রিগার করতে পারি।
mulla.azzi

উত্তর:


182

বাক্য গঠনটি নিম্নলিখিত:

function clickOnUpload() {
  $timeout(function() {
    angular.element('#myselector').triggerHandler('click');
  });
};

// Using Angular Extend
angular.extend($scope, {
  clickOnUpload: clickOnUpload
});

// OR Using scope directly
$scope.clickOnUpload = clickOnUpload;

কৌণিক আরো তথ্য পথ প্রসারিত এখানে

আপনি যদি কৌণিকের পুরানো সংস্করণ ব্যবহার করছেন তবে আপনার ট্রিগারহ্যান্ডলারের পরিবর্তে ট্রিগার ব্যবহার করা উচিত ।

আপনার যদি স্টপ প্রচার প্রচারের প্রয়োজন হয় তবে আপনি এই পদ্ধতিটি নীচে ব্যবহার করতে পারেন:

<a id="myselector" ng-click="clickOnUpload(); $event.stopPropagation();">
  Something
</a>

4
কৌনিকটির কোন সংস্করণ আপনি ব্যবহার করছেন? : triggerHandler 1.2.1 কাজ জরিমানা বলে মনে হয় jsfiddle.net/t34z7
Blago

13
দয়া করে ব্যাখ্যা করুন কেন $ (এলেম) .ক্লিক () কৌনিক সাথে কাজ করে না?
সের্গেই শেভচাইক

11
আপনি যদি jqLite- এ সীমাবদ্ধ থাকেন এবং কোনও নির্বাচক ব্যবহার করতে না পারেন তবে পরিবর্তে এটি করুন: কৌণিক.এলিমেন্ট (ডকুমেন্ট.কোয়ারিসিলিটর ('# মাই সিলেক্টর')) ট্রিগার ('ক্লিক করুন');
ড্যানিয়েল নলবাচ

3
@ ডানিয়েলনালবাখ বর্তমান (এবং ততটা বর্তমান নয়) কৌনিক সংস্করণ triggerHandlertrigger
1.2+ এর

1
আমি এখনও নিশ্চিত যে এটি এখনও কাজ করে না ... কৌণিক 1.6 এটি পুরো jquery নিয়ে কাজ করছে না বলে মনে হচ্ছে
জর্জ মাউয়ার

83
angular.element(domElement).triggerHandler('click');

সম্পাদনা: এটি উপস্থিত $ প্রয়োগ () চক্রটি বিচ্ছেদ করতে হবে বলে মনে হয়। এটি করার একটি উপায় হ'ল $ সময়সীমা () ব্যবহার করে:

$timeout(function() {
    angular.element(domElement).triggerHandler('click');
}, 0);

শিখর দেখুন: http://jsfiddle.net/t34z7/


2
এমনকি এই হল না কাজ, তার ছোড়া নিম্নলিখিত ত্রুটির ত্রুটি: [$ rootScope: inprog] errors.angularjs.org/1.2.14/$rootScope/inprog?p0=%24apply ত্রুটি দিকে (নেটিভ)
mulla.azzi

8
আপনি সম্ভবত প্রয়োজনের $timeoutপরিবর্তে অ্যাংুলার ব্যবহার করতে চান setTimeout, যেমন প্রয়োজনে আপনার জন্য $timeoutএকটি $applyচক্র চালানো হবে । এটি আপনার কোডকে আরও পরীক্ষামূলক করে তোলে কারণ এনজিএমক আপনাকে $timeoutকার্যকর করার সময় সম্পূর্ণ নিয়ন্ত্রণ দেয় । docs.angularjs.org/api/ng/service/$timeout
WildlyInaccurate

2
আসলে $timeout(fn, 0, false);এটি এমন হওয়া উচিত যাতে এটি আবেদন না করে $ প্রয়োগ করা উচিত নয়?
মার্টিন প্রোবস্ট

2
এটি গ্রহণযোগ্য উত্তর হওয়া উচিত। ট্রিগারহ্যান্ডলার কাজ করে। ট্রিগার v1.2.25-এ নেই
Howie

4
@deadManN $timeoutহ'ল একটি পরিষেবা এবং এটির ব্যবহারের আগে যেমন নির্ভরতা-ইনজেকশন হওয়া দরকার ডক্স.আঙ্গুলারজস.অর্গ
এপি /

19

নিম্নলিখিত সমাধানটি আমার পক্ষে কাজ করে:

angular.element(document.querySelector('#myselector')).click();

পরিবর্তে :

angular.element('#myselector').triggerHandler('click');

@ ডটকু সম্ভবত আপনি ইতিমধ্যে কোনও $ স্কোপ ফাংশনে রয়েছেন যেমন আপনি যখন কোনও $ টাইমআউট ফাংশন ব্যবহার করেন? অন্য কথায়, আপনি একটি কল করতে পারবেন না $ সুযোগ। $ প্রয়োগ () একটি $ সুযোগে $ প্রয়োগ করুন $ প্রয়োগ () ... আমি আশা করি এটি আপনাকে সাহায্য করবে।
jpmottin

@ জ্যামপোটিন আমি এটি পেয়েছি, এটি অবশ্যই $ সময়সীমার মধ্যে স্থাপন করা উচিত। ধন্যবাদ
ওয়েজিং জে লিন

1
ওএমজি, কৌণিক টোটাল্ট এটিকে নষ্ট করে দিয়েছে। কেন তারা jQuery এর $('#element').click()
নকল

13

সকলেই যদি এটি দেখতে পান তবে আমি একটি গুরুত্বপূর্ণ লাইনের সাথে অতিরিক্ত সদৃশ উত্তর যুক্ত করেছি যা ইভেন্টের প্রচারকে বিরত করবে না

$scope.clickOnUpload = function ($event) {    
    $event.stopPropagation(); // <-- this is important

    $timeout(function() {
        angular.element(domElement).trigger('click');
    }, 0);
};

ধন্যবাদ! এটি পরিশেষে 1.5.11, এবং সম্পূর্ণ জেকারি নির্ভরতাতে আমার জন্য কাজ করেছে। $ সময়সীমা (ফাংশন () {ভের এল = ডকুমেন্ট.জেট এলিমেন্টসওয়াই ক্লাসনাম ('ফা-শেভ্রন-আপ'); কৌণিক.এলিমেন্ট (এল)। ট্রিগার ('ক্লিক');}, 0);
ফ্লোরিডা জি।

9

পুরানো জাভাস্ক্রিপ্ট ব্যবহার করে আমার পক্ষে কাজ করেছে:
document.querySelector('#elementName').click();


হ্যাঁ। আমার জন্য কাজ কর. ধন্যবাদ।
ktaro

5

সবচেয়ে ভাল সমাধানটি ব্যবহার করা:

domElement.click()

কারণ অ্যাঙ্গুলারস ট্রিগারহ্যান্ডলার ( angular.element(domElement).triggerHandler('click')) ক্লিক ইভেন্টগুলি ডোম হাইয়ারার্কিতে বুদবুদ হয় না, তবে উপরের একটিটি করে - ঠিক একটি সাধারণ মাউস ক্লিকের মতো।

https://docs.angularjs.org/api/ng/function/angular.element

http://api.jquery.com/triggerhandler/

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click


4

আপনি পছন্দ করতে পারেন

$timeout(function() {
   angular.element('#btn2').triggerHandler('click');
});

আমি আমার এনজিও 1.5.3 অ্যাপ্লিকেশনটিতে এই সমাধানের জন্য এই ত্রুটিটি পেয়েছি: নির্বাচকদের মাধ্যমে উপাদান অনুসন্ধান করা jqLite দ্বারা সমর্থিত নয়।
টড হেল

1

সাধারণ নমুনা:

এইচটিএমএল

<div id='player'>
    <div id="my-button" ng-click="someFuntion()">Someone</div>
</div>

জাভাস্ক্রিপ্ট

$timeout(function() {
    angular.element('#my-button').triggerHandler('click');
}, 0);

এটি যা করে তা হ'ল বোতামটির সন্ধান idএবং একটি ক্লিক ক্রিয়া সম্পাদন। Voila।

সূত্র: https://techiedan.com/angularjs-how-to-trigger-click/


0

এই কোডটি কাজ করবে না (ক্লিক করার সময় একটি ত্রুটি নিক্ষেপ করুন):

$timeout(function() {
   angular.element('#btn2').triggerHandler('click');
});

নিম্নলিখিত হিসাবে আপনার ক্যোয়ারী নির্বাচনকারী প্রয়োজন :

$timeout(function() {
   angular.element(document.querySelector('#btn2')).triggerHandler('click');
});

0

আপনার পদ্ধতিতে নিম্নলিখিত লাইনটি অন্তর্ভুক্ত করুন আপনি ক্লিক ইভেন্টটি ট্রিগার করতে চান

angular.element('#btn_you_want_to_click_progmaticallt').triggerHandler('click');
});
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.