Значение можно получить с помощью чистого js, но это неправильное решение, но рабочее.
Получаем так у элемента <md-select id="myId" ... >... </md-select>
:
document.getElementById('myId').getElementsByTagName('div')[0].innerHTML
Правильное решение с использованием средств angular, но необходимо знать название контроллера (хотя в моем случае работает и получением элемента по ИД).
var get2 = function() {
var data = angular //вызов функции angular
.element(document.querySelector('[ng-controller="TestCtrl"]')) //получение контроллера
//.element(document.getElementById('myId')) //или этот вариант
.scope() //получение значений контроллера
.myOption; //сама переменная <md-select ng-model="myOption">
console.log('data = ' + data.id); //значение из переменной
}
Еще одно правильное решение использовать angular:
$scope.upload = function(){
console.log('myOption = '+$scope.myOption);
var data = {myOption: $scope.myOption};
$http.post('api/sendMyData', data).then(function (data) {
}); }
Здесь создается функция, которая получает нужный элемент, который указан так: <md-select ng-model="myOption"> ...
и отправляет его значение на сервер. Кнопка по которой срабатывает эта фукнция: <input type="button" value="Press me" ng-click="upload()" />
.
Рабочий пример:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://rawgit.com/angular/bower-material/master/angular-material.css">
<script data-semver="1.3.14" src="https://code.angularjs.org/1.3.14/angular.js" data-require="angular.js@1.3.x"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-animate.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-aria.js"></script>
<script src="https://rawgit.com/angular/bower-material/master/angular-material.js"></script>
<script>
//вот правильный вариант, так можно получить (3 кнопка)
var get2 = function() {
var data = angular
.element(document.querySelector('[ng-controller="TestCtrl"]'))
//.element(document.getElementById('myId'))
.scope()
.myOption;
console.log('data = ' + data.id);
}
//неправильно: эта функция получает значение переменной и выводит в консоль на JS
var get = function() {
var val = document.getElementById('myId').getElementsByTagName('div')[0].innerHTML;
console.log(val);
}
angular.module("my-app", ["ngMaterial"])
.controller("TestCtrl", function($scope, $http) {
//Так должно выглядеть правильно:
//начало: получить выбранное значение пользователя и отправить на сервер
$scope.upload = function(){
console.log('myOption = '+$scope.myOption);
var data = {myOption: $scope.myOption};
$http.post('api/sendMyData', data).then(function (data) {
}); }
//конец
$scope.optionLists = [
{id:1, val:'john'},
{id:2, val:'max'},
{id:3, val:'mark'},
{id:4, val:'robin'}
];
$scope.myOption = $scope.optionLists[1];
})
</script>
</head>
<body ng-app="my-app" ng-controller="TestCtrl">
<div>
<span>
Value: {{myOption}}
</span>
</div>
<div>
<span>Default : </span>
<md-select id="myId" ng-model="myOption" placeholder="Select a option">
<md-option ng-value="option" ng-repeat="option in optionLists">{{ option.val }}</md-option>
</md-select>
</div>
<br>
<input type="button" value="Так не правильно" onclick="get()" /> <!-- чистый JS -->
<input type="button" value="Правильное выполнение" ng-click="upload()" /> <!-- angular -->
<input type="button" value="Получить с помощью JS + angularJS" onclick="get2()" /> <!-- чистый JS + angular -->
</body>
</html>
document.getElementById('brandFilter').value
? Да и сам вопрос не очень понятен, для чего эти данные нужны? И добавьте код, откуда данные получаете. – MrFylypenko 14 окт '16 в 8:03<md-select name="fieldTm9" ng-model="fieldTm9" placeholder="Одежда"> <md-option value="1">Item 1</md-option> <md-option value="2">Item 2</md-option> <md-option value="3">Item 3</md-option> </md-select>
– Max ProstoMax 14 окт '16 в 8:27