【问题标题】:Change radio model on button click [angularjs]更改按钮单击 [angularjs] 上的无线电模型
【发布时间】:2014-06-09 12:39:10
【问题描述】:

我想要实现的是当我单击按钮更改输入时触发收音机模型“值”的更改。 为什么我需要调用两次才能更新模型并检查收音机?

http://jsfiddle.net/7GfB9/

HTML

<div ng-app ng-controller="Ctrl">
    <input type="radio" ng-model="value" ng-value="33">
    <input type="radio" ng-model="value" ng-value="22">{{ value }}
    <button onclick="changeInput()">Change input</button>
</div>

JS

function Ctrl($scope) {

}

function changeInput() {
    $('input:eq(0)').click().click();
}

【问题讨论】:

  • 为什么要混合使用 jQuery 和 angularjs?
  • @Satpal 假设我不知道第一个输入的值为 33,但我仍然想检查它并更新模型你会怎么做?我能让它工作的唯一方法是做类似 $scope.value = $('input:eq(0)').val()
  • 我会这样做,jsfiddle.net/7GfB9/4 因为你的问题我不清楚。这是一个猜测
  • @Satpal 但问题是在我的真实代码中我不知道这些值是什么所以唯一的方法是使用 jquery 来获取它。
  • 我想我明白了。纠正我如果我错了,最初value 可以有任何值,你想选择第一个单选按钮作为选中

标签: javascript jquery angularjs


【解决方案1】:

我想出的解决方案。我是 angularjs 的新手,似乎我还没有习惯。

HTML

<div ng-app ng-controller="Ctrl">
    <input type="radio" ng-model="value" ng-value="33">
    <input type="radio" ng-model="value" ng-value="22">{{ value }}
    <button ng-click="changeInput()">Change input</button>
</div>

js

function Ctrl($scope) {
    $scope.changeInput = function () {
        $scope.value=$('input:eq(0)').val();
    }    
}

【讨论】:

  • 这将始终赋予第一个单选按钮值
  • @Satpal 我在我的真实代码应用程序中使用了一个 id,以便它只从我想要的容器中获取一个。
【解决方案2】:

忘记 jQuery,试试这个:

<button ng-click="value = 33">Change input</button>

http://jsfiddle.net/7GfB9/3/

【讨论】:

  • 在这个例子中,你可以这样硬编码,但在我的真实代码中,它更加动态
【解决方案3】:

可能是因为在调用 onclick 函数之前该值已更新。为什么不更新 onclick 函数中的值并且只使用一次单击?

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-05-29
    • 2017-03-06
    • 1970-01-01
    • 1970-01-01
    • 2013-12-27
    • 1970-01-01
    相关资源
    最近更新 更多