如何以編程方式觸發角度帶bs-選擇

我正在使用angularstrap的bs-select做下拉列表選擇。我想以編程方式使用JavaScript觸發下拉列表按鈕。這裏是plunker：如何以編程方式觸發角度帶bs-選擇

Plunker Link

我想用按鈕來觸發下拉列表中。我已經嘗試了三種方法：

angular.element(document.querySelector("#test1")).triggerHandler('click');

它的工作原理與ng-click的元素。但並沒有在bs-select

工作

document.getElementById("test1").click();

仍然爲triggerHandler('click')

沒有工作

angular.element(document.querySelector("#test1")).triggerHandler('click'); $scope.$apply()

我認爲這將是問題的範圍需要再次消化，但事實證明，情況並非如此。

及其在角帶的BS-選擇代碼如下：

$select.$onMouseDown = function(evt) { 
    // Prevent blur on mousedown on .dropdown-menu 
    evt.preventDefault(); 
    evt.stopPropagation(); 
    // Emulate click for mobile devices 
    if(isTouch) { 
     var targetEl = angular.element(evt.target); 
     targetEl.triggerHandler('click'); 
    } 
};

當它是mousdown它觸發該按鈕的點擊。那我該怎麼辦呢？

感謝您的回覆。

來源

2015-06-01 Gabriel

如果您使用的是jQuery，那麼只需使用'$（targetEl）.trigger（'click'）' –

@ pankajparkar角度帶不是我的代碼。我正在使用這個角度帶庫進行一些開發。由於我使用角度，所以我沒有使用jQuery。 – Gabriel

@Gabriel是否願意使用角度帶下拉？ – scniro

-1

我終於弄清楚如何處理這個問題。這裏是plunker：

plunker link

triggerHandler('click')

應該

triggerHandler('mousedown')

如角帶它使用onmousedown事件的事件處理程序，所以在觸發器處理程序，我不應該用triggerHandler （ '點擊'）。相反，我應該使用triggerHandler（'mousedown'）來觸發事件。現在它起作用了。

來源

2015-06-03 16:32:32 Gabriel

我不是特別興奮的不接受。這個解決方案並不理想。當api爲此特定場景提供手動配置時，您正在黑客點擊事件。你現在也失去了隱藏你的下拉菜單的能力，你可能會利用更多的黑客手段作爲解決方法。綁定到一個變量是理想的 – scniro

@salniro所以我正在實現應用程序的自動演練，我將以編程方式單擊下拉列表中的項目。並且該應用程序已經完成了bs-select，將其更改爲單個漫遊功能的下拉菜單很痛苦。所以我希望它能幫助有同樣問題的其他人。 – Gabriel

我遇到過與AngularStrap類似的問題。在這些指令中有一個配置選項trigger，可選值爲manual。這是我們需要利用的配置選項，以實現我們想要的。

這個問題，是沒有文件的任何地方使用這個。由於在你提到的評論中你可以使用AngularStrap Dropdowns，經過很多努力，我找到了解決這個問題的方法。觀察該實施下拉的...

<button ng-model="expression" intellisense bs-dropdown="values" bs-show="drop">dropdown</button>

app.config(function($dropdownProvider) { 
    angular.extend($dropdownProvider.defaults, { 
     trigger: 'manual' 
    }); 
});

你會注意到的bs-show的元素有關的屬性。這是根據true或false值觸發滴定的綁定。讓我們來配合這另一個元素ng-click事件......

<button ng-click="fireDropDown()">Manually Drop</button>

$scope.fireDropDown = function() { 
    $scope.drop = $scope.drop ? false : true; 
}

我試圖做同樣的bs-select，但（這並不奇怪），它不工作。這裏有一些額外的資源可以幫助你。

Plunker Example - 觸發下拉手動

Display AngularStrap Dropdown Manually - How? - 所以我提出的問題，而打我的頭在這個問題上

feat(tips,pickers): add bsShow visibility attr (fixes #723) - 修正了應該有固定的這個。不確定爲什麼修復不跨越所有指令，包括bs-select。

來源

2015-06-02 21:23:32 scniro

感謝您的解決方案！真的很感激它！ – Gabriel

如何以編程方式觸發角度帶bs-選擇

回答

相關問題