如何获得元素文本和值由#ID 100％AngularJS选择 [英] How to get Text and Value in element SELECT by #ID 100% AngularJS

问题描述

有一个更好的方式做AngularJS，与我的例子code更少的行..？
我们的想法是用AngularJS和jqLit​​e使其100％。

链接比如我的code的解决方案： http://jsfiddle.net / EOM / xecymL9t /

HTML：

 ＆LT; D​​IV数据-NG-控制器=主数据-NG-应用＆GT;  ＆LT;选择一个id =哟的数据-NG-模式=选择数据-NG-变化=样品（选择）需要=需要＆GT;
    ＆LT;期权价值=11选择=选择＆GT;名称2'; /选项＆GT;
    ＆LT;期权价值=10＆GT;名称1 LT; /选项＆GT;
    ＆LT;期权价值=＆GT;选择缺省INIT ANGULAR LT＆; /选项＆GT;
    ＆LT;期权价值=12＆GT;名称3'; /选项＆GT;
  ＆LT; /选择＆GT;
 

查看显示在控制台浏览器（F12）

AngularJS：

 函数main（$范围，$文件）{$ scope.sample =功能（myvalue的）{
        //获取编号查询
        变种E = $文件[0] .getElementById（'哟'）;
    //获取所有选项中进行选择
    E = angular.element（五）.find（'选项'）;
    //循环
    angular.forEach（即功能（V，K）{
        //是选项进行选择..？
        如果（angular.element（五）.prop（'选择'））{
        //获取文本选项选中
        的console.log（'文字：+ angular.element（V）的.text（））; //文本
      }
    }）;
    的console.log（'值：'+ myvalue的）//值
}}
 

解决方案

根据解决方案的 jbMartinez ，我看到了一个简单的解决方案缩短了把手。
和检索所选选项的文本。

对于兼容性尼克拉斯拉尔森是有> = IE9 或更高，因为我使用的 AngularJS 1.5.0 并它不为支持＆LT; = IE8

说的，把它看作是一个最终的解决方案也可能是一个更好的办法..？

code实例只在JS改变：

 函数main（$范围，$文件）{$ scope.sample =功能（myvalue的）{    VAR =设为myVal（myvalue的）myvalue的？'';
    //获取文本选择
    VAR MYTEXT = $文件[0] .querySelector（'＃哟[值=+ +设为myVal']）的文本。
    //显示控制台中选择文本选项
    的console.log（'文字：+ MYTEXT）; //文本
    的console.log（'值：'+设为myVal）//值}}
 

链接示例执行 这里

There is a better way to do AngularJS, with fewer lines of code that my example ..? The idea is to make it 100% with AngularJS and jqLite.

Link Example My CODE solution: http://jsfiddle.net/EOM/xecymL9t/

HTML:

<div data-ng-controller="Main" data-ng-app>

  <select id="yo" data-ng-model="selection" data-ng-change="sample(selection)" required="required">
    <option value="11" selected="selected">Name 2</option>
    <option value="10">Name 1</option>
    <option value="">SELECT DEFAULT ANGULAR INIT</option>
    <option value="12">Name 3</option>
  </select>

View Show in Console to Browser (F12)

AngularJS:

function Main($scope, $document) {

$scope.sample = function(myvalue) {
        // Get By ID
        var e = $document[0].getElementById('yo');
    // Get all options select
    e = angular.element(e).find('option');
    // Loop
    angular.forEach(e, function(v, k){
        // Is option selected..?
        if(angular.element(v).prop('selected')){
        // Get Text option selected
        console.log('Text: '+angular.element(v).text()); // Text
      }
    });
    console.log('Value: '+myvalue) // Value
}}

解决方案

Based on solution "jbMartinez", I saw a simpler solution shortens the handles. And retrieve the text of the option selected.

With respect to compatibility "Niclas Larsson" is to have >= IE9 or higher, since I am using AngularJS 1.5.0 and it does not support for <= IE8

Are saying, see it as a final solution or it may be a better way ..?

Code Example only change in JS:

function Main($scope, $document) {

$scope.sample = function(myvalue) {

    var myval = (myvalue)?myvalue:'';
    // Get text select
    var mytext = $document[0].querySelector('#yo [value="' + myval + '"]').text;
    // Show Text option selected in console
    console.log('Text: '+mytext); // Text
    console.log('Value: '+myval) // Value

} }

Link Example Run HERE

这篇关于如何获得元素文本和值由#ID 100％AngularJS选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！