使用angularjs获取元素的值

如何使用angular可以获得this.coefficient值？我试图使用下面的代码ng-click，但我可以得到整个HTML只为第一.coefficient价值（我有这样一个巨大的一堆收音机）。我可以用jquery解决这个问题，但是我需要将.coefficient的值乘以动态添加输入。使用angularjs获取元素的值

$scope.getCoeff = function(){ 
    var coefficient = document.body.querySelector('.coefficient'); 
    console.log(coefficient); 
}

<label class="bet-team-box" for="radio-1"> 
    <input class="bet-main-input" id="radio-1" name="group1" type="radio" ng-click="getCoeff()"> 
    <span class="fake-label"> 
     <span class="team">Midnight Sun Esports</span> 
     <span class="img-box"><img src="images/logo-team-04.png" alt="image description" width="20" height="20" /></span> 
     <span class="coefficient">12.43</span> 
    </span> 
</label>

jsfiddle

来源

2016-07-05 Bogdan Tushevskyi

你能换一个指令，所有的电台吗？ – gianni

你能用你的代码做一个小提琴吗？ – NNR

@gianni是的，没问题 –

我会使用jqLite和访问通过angular.element(coefficient).text()值：如果你喜欢

JSFiddle

angular.module('myApp', []); 
 

 
angular.module('myApp').controller('MyCtrl', function($scope) { 
 
    $scope.getCoeff = function(e) { 
 
    // Get the input element on a jQlite context 
 
    var $input = angular.element(e.target); 
 

 
    // Loop through '.fake-label' children 
 
    angular.forEach($input.next().children(), function(child, index) { 
 
     var $child = angular.element(child); 
 

 
     // Find the '.coefficient' child 
 
     if ($child.hasClass('coefficient')) { 
 
     // Do whatever you want with the value 
 
     console.log(parseFloat($child.text())); 
 
     } 
 
    }); 
 
    } 
 
});

label { 
 
    display: block; 
 
} 
 
input:hover { 
 
    cursor: pointer; 
 
} 
 
label:hover { 
 
    cursor: pointer; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl as vm"> 
 
    <label class="bet-team-box" for="radio-1"> 
 
    <!-- Send the angular variable $event to access the target element --> 
 
    <input class="bet-main-input" id="radio-1" name="group" type="radio" ng-click="getCoeff($event)"> 
 
    <span class="fake-label"> 
 
     <span class="team">Midnight Sun Esports</span> 
 
    <span class="img-box"><img src="https://addons.cdn.mozilla.net/user-media/addon_icons/329/329121-64.png?modified=1379222157" alt="image description" width="20" height="20" /></span> 
 
    <span class="coefficient">12.43</span> 
 
    </span> 
 
    </label> 
 
    <label class="bet-team-box" for="radio-2"> 
 
    <!-- Send the angular variable $event to access the target element --> 
 
    <input class="bet-main-input" id="radio-2" name="group" type="radio" ng-click="getCoeff($event)"> 
 
    <span class="fake-label"> 
 
     <span class="team">Night Esports</span> 
 
    <span class="img-box"><img src="https://addons.cdn.mozilla.net/user-media/addon_icons/329/329121-64.png?modified=1379222157" alt="image description" width="20" height="20" /></span> 
 
    <span class="coefficient">11.5</span> 
 
    </span> 
 
    </label> 
 
</div>

来源

2016-07-05 09:33:37 Elfayer

是否可以使用这个代码'.this'系数？因为我有一对无线电 –

我更新了我的答案。希望这会有所帮助，请告诉我是否还有其他事情会打扰您。抱歉耽搁了。 – Elfayer

你以前在哪里））我已经使用jQuery的所有逻辑 –

在这里，我使用的控制器/指令传递的coefficient值，我可以使用对象/数组传递多个值。并单击单选按钮我正在通过各自的价值。目前仅通过系数。

$scope.coefficient = 12; // Pass this value to HTML 

$scope.getCoeff = function(coefficient){ 
    var coefficient = coefficient; 
    console.log(coefficient); 
} 


<label class="bet-team-box" for="radio-1"> 
<input class="bet-main-input" id="radio-1" name="group1" type="radio" ng-click="getCoeff('coefficient')"> 
<span class="fake-label"> 
    <span class="team">Midnight Sun Esports</span> 
    <span class="img-box"><img src="images/logo-team-04.png" alt="image description" width="20" height="20" /></span> 
    <span class="coefficient" ng-bind="coefficient"></span> 
</span> 
</label>

这将工作:)

干杯！

来源

2016-07-05 09:30:10 varit05

问题是'.coefficient'的值从服务器产生，我不能设置值 –

它是否来自一些REST api？ – varit05

是的，但我只有访问HTML –

你可以把它作为一个参数传递给函数

<input class="bet-main-input" id="radio-1" 
    name="group1" type="radio" ng-click="getCoeff($event,12.43)">

JSFIDDLE

来源

2016-07-05 09:31:49 brk

同样的问题，我不能设置'。系数'值 –

好的，写了一个新的答案，因为代码。如果您使用的指令，你可以找到这样所有.coefficient元素：

.directive('myDirective', function() { 
return { 
    restrict: 'E',  
    link: function($scope, element, attrs) { 
     var coefficient = element.find('.coefficient'); 
     // Do your calculation here 
     //-------------     
    } 
};

}）

来源

2016-07-05 09:36:23 gianni

使用angularjs获取元素的值

回答

相关问题