个人中心
gpt4 book ai didi

javascript - AngularJS 将 Bootstrap 按钮组值传递给 Controller

转载 作者：行者123 更新时间：2023-11-30 08:32:13 25 4
gpt4 key购买 nike

我有一个按钮组，我想将所选按钮的值传回我的 Controller ，但它不起作用，它只返回未定义的...

HTML

<body ng-app="myApp">
    <div ng-controller="myCtrl">
        <button type="button" ng-model="activeCustomer" value="active" ng-click="getVal()" class="btn btn-default">Active</button>
        <button type="button" ng-model="activeCustomer" value="inactive" ng-click="getVal()" class="btn btn-default">Inactive</button>
        <button type="button" ng-model="activeCustomer" value="all" ng-click="getVal()" class="btn btn-default">All</button>

        {{change}}
    </div>

Controller :

aap=angular.module('myApp',[])
.controller('myCtrl',["$scope",function($scope){
  //set the radio buttons
    $scope.change='the data';
    $scope.getVal=function(){
        console.log($scope.change);
        console.log($scope.activeCustomer);
        $scope.change=$scope.activeCustomer;
    }
}]);

但是，如果我将代码从 <button type="button" 更改为至 <input type="radio"有用!有任何想法吗？谢谢

http://plnkr.co/edit/Hfu7EGQ05hA59Sgty29H?p=preview

最佳答案

这是工作代码 - 

<body ng-app="myApp">
<div ng-controller="myCtrl">
        <button type="button" ng-model="activeCustomer" value="active" ng-click="getVal($event)" class="btn btn-default">Active</button>
        <button type="button" ng-model="activeCustomer" value="inactive" ng-click="getVal($event)" class="btn btn-default">Inactive</button>
        <button type="button" ng-model="activeCustomer" value="all" ng-click="getVal($event)" class="btn btn-default">All</button>

        {{change}}
    </div>


<script>
aap=angular.module('myApp',[])
.controller('myCtrl',["$scope",function($scope){
  //set the radio buttons
    $scope.change='the data';
    $scope.getVal=function(active){
        console.log($scope.change);
        console.log(active.currentTarget.value);
        $scope.change=active.currentTarget.value;
    }
}]);


</script>

您需要为每个按钮传递 $event 并在 Controller 中访问它。然后您可以更改该值。

这里是 plunker:-

http://plnkr.co/edit/wkzJ46zRoczkMPomzEok?p=preview

关于javascript - AngularJS 将 Bootstrap 按钮组值传递给 Controller ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35987359/

25 4 0
文章推荐： javascript - JQuery closest 属性返回 undefined
文章推荐： Tensorflow freeze_graph索引错误: list index out of range
文章推荐： tensorflow - 具有交叉熵的像素级 softmax 用于多类分割
文章推荐： javascript - window.location.href 在 Meteor 中不起作用
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com