選擇選項標籤上的火焰切換功能

我在這裏有一個奇怪的查詢。請參閱本的jsfiddle選擇選項標籤上的火焰切換功能

<select ng-model="bob" ng-click="test()"> 
        <option value="5">5</option> 
        <option value="10">10</option> 
        <option value="15">15</option> 
</select>

正如你可以在這個小提琴看，我有選擇5,10和15.如果用戶選擇10或15，NG-change事件被觸發和警報消息彈出。正如你注意到的那樣，5在這裏默認選中並且最初顯示。

如果我想通過選擇5本身來觸發ng-change，該怎麼辦。它不起作用。顯然它不會工作，因爲我們選擇的價值是5，並且它與之前的價值相同。因此ng-change不會觸發。我明白這一點。

但我有一個場景，我想在用戶再次選擇默認值時觸發一個函數。有人能幫助我嗎？

PS-我不能使用ng-click，因爲一旦我們點擊選項標籤本身就會觸發事件。所以它不會讓你從下拉列表中選擇，並立即引發事件。

來源

2017-03-21 Rihana

嘗試使用ng-change調用控制器中的一個函數，查看您選擇的選項並確定它是否爲默認選項。每當用戶選擇默認選項時，您可以調用您想要的任何代碼。

實施例（HTML）：

<select 
    ng-change='myChangeFunction()' 
    ng-model="mySelectedOption" 
    ng-options="myOptions"> 
</select>

實施例（JS）：僅

$scope.myOptions = [ 
    { id: "5", name: "5" }, 
    { id: "10", name: "10" }, 
    { id: "15", name: "15" } 
]; 

$scope.myChangeFunction = function() { 
    if($scope.mySelectedOption.id === 5) { 
     // Default value has been selected, call your function 
    } 
};

來源

2017-03-21 19:26:28

請爲您的代碼所做的事情添加說明。 – Soviut

ng-change/watch作品當模型被改變，或者，也可以使用納克選擇指令，

<select ng-model="bob" ng-selected="test()">

DEMO

來源

2017-03-21 19:28:28 Sajeetharan

這是完全不準確的。 'ng-selected'指令用於有條件地添加'selected'屬性。請參閱https://docs.angularjs.org/api/ng/directive/ngSelected – oBusk

嘗試通過NG-模型價值，你的功能。

HTML

<select ng-model="bob" ng-click="test(bob)"> 
    <option value="5">5</option> 
    <option value="10">10</option> 
    <option value="15">15</option> 
</select>

的Javascript

$scope.test = function (value) { 
alert ("changed to "+ value); 
}

來源

2017-03-21 19:30:22 mmounirf

也許這可以幫助你。

<select ng-model="bob" ng-change="test()"> 
    <option disabled value="">Select value ...</option> 
    <option value="5">5</option> 
    <option value="10">10</option> 
    <option value="15">15</option> 
</select>

這裏我已經創建了另外一個選項，它被禁用並用作佔位符來選擇選項。您可能不需要再次觸發值爲5的選項。

請檢查JSFiddle是否有任何疑問。

希望這是有幫助的。謝謝。

來源

2017-03-21 19:34:34

選擇選項標籤上的火焰切換功能

回答

相關問題