Javascript 在选择标签中使用 ng-click 的角度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/31136984/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
angular using ng-click in a select tag
提问by user2412643
I want a dropdown list to change the language my site is displayed in, so I currently have:
我想要一个下拉列表来更改我的网站显示的语言，所以我目前有：
<select ng-controller="langCtrl">
<option ng-click="switchLanguage('en')" value="en">EN</option>
<option ng-click="switchLanguage('de')" value="de">DE</option>
<option ng-click="switchLanguage('it')" value="it">IT</option>
<option ng-click="switchLanguage('fr')" value="fr">FR</option>
<option ng-click="switchLanguage('es')" value="es">ES</option>
</select>
However for some reasons these ng-clicks don't seem to be calling the specified function. I changed them all to buttons, and that seemed to work fine, but I want a dropdown list, not buttons. Can anyone tell me why this doesn't work?
但是由于某些原因，这些ng-clicks 似乎没有调用指定的函数。我将它们全部更改为按钮，这似乎工作正常，但我想要一个下拉列表，而不是按钮。谁能告诉我为什么这不起作用？
Controller code:
控制器代码：
app.controller('langCtrl', function($translate, $location, $scope) {
$scope.switchLanguage = function (langKey) {
switch(langKey) {
case 'en':
$location.url('/#en');
break;
case 'de':
$location.url('/#de');
break;
case 'it':
$location.url('/#it');
break;
case 'fr':
$location.url('/#fr');
break;
case 'es':
$location.url('/#es');
break;
default:
$location.url('/#en');
}
$translate.use(langKey);
};
});
回答by Icycool
A proper way to do this would be using ng-model
正确的方法是使用 ng-model
angular.module('test', [])
.controller('langCtrl', function($scope, $location/*, $translate*/) {
$scope.switchLanguage = function() {
langKey = $scope.selected;
switch (langKey) {
case 'en':
alert('/#en');
//$location.url('/#en');
break;
case 'de':
alert('/#de');
//$location.url('/#de');
break;
case 'it':
alert('/#it');
//$location.url('/#it');
break;
case 'fr':
alert('/#fr');
//$location.url('/#fr');
break;
case 'es':
alert('/#es');
//$location.url('/#es');
break;
default:
alert('/#en');
//$location.url('/#en');
}
//$translate.use(langKey);
}
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<select ng-app='test' ng-controller="langCtrl" ng-model="selected" ng-change="switchLanguage()">
<option value="en">EN</option>
<option value="de">DE</option>
<option value="it">IT</option>
<option value="fr">FR</option>
<option value="es">ES</option>
</select>Not sure why your example doesn't work though, it looks fine.
不知道为什么你的例子不起作用，它看起来不错。
回答by Ramesh Rajendran
You can using with ng-modeland ng-change
您可以使用ng-model和ng-change
Try this
尝试这个
<div ng-controller="langCtrl">
<select ng-change="switchLanguage(ModelName)" ng-model="ModelName">
<option value="en">EN</option>
<option value="de">DE</option>
<option value="it">IT</option>
<option value="fr">FR</option>
<option value="es">ES</button>
</select>
</div>
controller
控制器
$scope.switchLanguage = function(ModelName)
{
var seletedValue = ModelName;
}
