【问题标题】:AngularJS - ngmodel and input type buttonAngularJS - ngmodel 和输入类型按钮
【发布时间】:2016-01-26 02:45:16
【问题描述】:

我有一个基本上是单选类型选择的东西,但是因为我希望它看起来更像一个选择网格,所以我选择制作一个输入类型按钮并在点击时触发一个功能,但我有一个问题。 ng-model 不会将我单击的按钮的值绑定到控制器部分,我知道它可以作为单选按钮正常工作。

解决这个问题的最快方法是什么?我假设有一种比重新定义单选按钮的 css 更简单的方法......尤其是因为除了将点击时的值与变量本身链接之外,这一切都已完成。

有问题的部分:

        <div class="aquipartners" id="aquipartnersID">               
            <input ng-repeat="partner in partners" align="center" type = 'button' class = "aquipartnernamebutton" id='aqui{{partner.name.PT}}' value='{{partner.name.PT}}' ng-model='newaquisubmission.part' onclick ='partnerselect()'>
            </input>
        </div>

在 JS 方面:

    function partnerselect(){


        var scopepartnerbutton = $('#subtitleid').scope().newaquisubmission.part;

        alert(scopepartnerbutton);

        if(scopepartnerbutton !== ""){

            //the stuff I want to do, I added the if as a safeguard while I program everything
        }

    };

【问题讨论】:

  • 使用ng-click 而不是onclick
  • 没有意义。当模型与价值不同时,您期望ng-model 做什么?为什么这里涉及到 jQuery 或 onclick
  • 抱歉,我希望它把我点击的按钮的值 value='{{partner.name.PT}}' 添加到 ng-model='newaquisubmission.part' 上的控制器变量中也许我以错误的方式接近这个......
  • 可能是。虽然不太清楚您要做什么
  • ng-repeat 中使用ng-model="x[$index]"

标签: javascript jquery html angularjs ionic-framework


【解决方案1】:

正如@georgeawg 所说,使用 ng-click。确保你的控制器上有这个:

$scope.partnerselect = partnerselect 

和 partnerselect 应该这样声明:

function partnerselect(value) {
if($scope.newaquisubmission.part){
   $scope.newaquisubmission.part = value; //Assuming this is what you want to do..
}    
}

在你看来:

    <div class="aquipartners" id="aquipartnersID">               
        <input ng-repeat="partner in partners" align="center" type = 'button' class = "aquipartnernamebutton" id='aqui{{partner.name.PT}}' value='{{partner.name.PT}}' ng-click ="partnerselect(partner.name.PT)">
        </input>
    </div>

【讨论】:

  • 工作得很好,虽然我遇到了一个相对较小的问题,它找不到变量 $scope。我设法通过使用 scope() 方法来解决它,但我假设这不是最好的方法。我可能在某个地方有一个错误触发了这个,你知道它通常是什么吗?提前致谢
  • 说实话我不知道。我对角度也很陌生。它必须是你编码的方式。也许你正在这样做: module.controller("myController", ["$scope", "$rootScope", myController]) 而有些人这样声明: module.controller("myController", ["$scope ", "$rootScope", function() { //$scope.isAvailable = true }])
  • 最好让专家解释这些东西。无论如何,对我的回答表示赞赏:D
【解决方案2】:

我通过使用 (click) 而不是 onclick 解决了类似的问题

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-08-18
    • 2015-06-20
    • 1970-01-01
    • 2018-06-27
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多