Мой код:Получение текста нг-вариант внутри HTML

HTML:

<select ng-model="selectedItem" ng-options="item.result as item.name for item in items"></select>

JS:

$scope.items = [{'name': 'Yes', 'result': true },{ 'name': 'No', 'result': false }];

Я хочу, чтобы отобразить Да и Нет в окне выбора, тогда я должен отправьте true и false на сервер, если выбрано «Да» или «Нет».

У меня есть другой div, где я должен отображать текст опции (т.е. Да или Нет (выбранный)). Я использовал {{selectedItem.label}}, но он не работает. Пожалуйста помоги.

источник

2017-01-12 karthi

Используется ответ Sajeetharan и обновили его, чтобы удовлетворить ваши требования. Ниже приводится код:

<!DOCTYPE html> 
<html ng-app="todoApp"> 

<head> 
<title>To Do List</title> 
<link href="skeleton.css" rel="stylesheet" /> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script> 
<script src="MainViewController.js"></script> 
</head> 


<body ng-controller="dobController"> 
    <select class="form-control" id="selection" ng-model="currentSelected" ng-options="selection.result as selection.name for selection in items"></select> 
    <div> 
     <h1> Selected one is : {{currentSelected? "Yes": (currentSelected == null)? "":"No"}} </h1> 
    </div> 
    <script> 
     var app = angular.module('todoApp', []); 

     app.controller("dobController", ["$scope", 
     function($scope) { 

      $scope.items = [{'name': 'Yes', 'result': true },{ 'name': 'No', 'result': false }]; 
     } 
     ]); 

    </script> 
</body> 

</html>

источник

2017-01-12 13:23:57 rambo

Не удалось найти способ ссылки Вернемся к именам выбора, как при установке параметра, у него есть только то, что отображается, selection.name и значение как selection.result. Но ng-model будет содержать только значение. Следовательно, добавленный тернарный оператор в выражении, который поддерживается выражения – rambo

Примечание: Я не знаю, как отформатировать код, как это сделал Саджетаран. Извините за это. – rambo

Спасибо, что оператор ternery, который вы использовали, помог мне. – karthi

Demo

var app = angular.module('todoApp', []); 
 

 
app.controller("dobController", ["$scope", 
 
    function($scope) { 
 
    
 
    $scope.items = [{'name': 'Yes', 'result': true },{ 'name': 'No', 'result': false }]; 
 
    } 
 
]);

<!DOCTYPE html> 
 
<html ng-app="todoApp"> 
 

 
<head> 
 
    <title>To Do List</title> 
 
    <link href="skeleton.css" rel="stylesheet" /> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script> 
 
    <script src="MainViewController.js"></script> 
 
</head> 
 

 

 
<body ng-controller="dobController"> 
 
    <select class="form-control" id="selection" ng-model="currentSelected" ng-options="selection.result as selection.name for selection in items"></select> 
 
    <div> 
 
    <h1> Selected one is : {{currentSelected}} </h1> 
 
    </div> 
 
</body> 
 

 
</html>

источник

2017-01-12 12:18:49 Sajeetharan

В HTML я хочу "Да" или "Нет" в этом разделе

Selected один является: {{}} currentSelected

. Теперь, если мы изменим окно выбора, мы получаем true или false в этом разделе. – karthi

это зависит от того, что вам нужно. измените его как ng-options = "selection.name как selection.name – Sajeetharan

Я хочу показать Да или Нет в интерфейсе, тогда как мне нужно отправить true или false серверу на основе выбора – karthi

Используйте директиву, чтобы получить желаемый результат отображения выбранного значения имени элемента, но отправить значение результата бакэнду.

var app = angular.module('app', []); 
 

 
app.controller("myctrl", ["$scope", 
 
    function($scope) { 
 

 
    $scope.items = [{ 
 
     'name': 'Yes', 
 
     'result': true 
 
    }, { 
 
     'name': 'No', 
 
     'result': false 
 
    }]; 
 
    } 
 
]); 
 

 
app.filter('getvalue', function() { 
 

 
    return function(value, array) { 
 
    if (value !== undefined && value !== null) { 
 
     var selectedOption = array.filter(function(l) { 
 
     if (l.result == value) { 
 
      return l; 
 
     } 
 
     })[0]; 
 
     return selectedOption["name"]; 
 
    } else { 
 
     return ""; 
 
    } 
 
    } 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="app" ng-controller="myctrl"> 
 
    <select class="form-control" id="selection" ng-model="currentSelected" ng-options="selection.result as selection.name for selection in items"></select> 
 
    <div> 
 
    Displayed Text : {{currentSelected | getvalue:items}} 
 
    </div> 
 
    
 
    <div> 
 
    Value which will be send : {{currentSelected}} 
 
    </div> 
 
    
 
    
 
    
 
</body>

источник

2017-01-13 12:58:14 Deep

Получение текста нг-вариант внутри HTML

ответ

Selected один является: {{}} currentSelected

Смежные вопросы