angular 單選框

本文轉載自查看原文 2017-11-13 15:32 1141 angular/ 單選框

進行參數配置的時候，單選是很常見的選項，input 提供了一個單選按鈕類型方便單選使用，那么該如何結合 angular 來使用呢？

<!DOCTYPE html>
<html ng-app='myApp'>
    <head>
        <meta charset='utf-8'>
        <script src='angular.js'></script>
        <script src='jquery-1.11.3.js'></script>
    </head>
    <body>
        <div ng-controller='myCtrl'>
            <div>Are you happy ?</div>
            <div>
                <label>
                    <input type="radio" ng-model="isHappy" name='isHappy' ng-value='true' ng-change="isHappyFnc(true)">
                    <span>Yes</span>
                </label>
                <label>
                    <input type="radio" ng-model="isHappy" name='isHappy' ng-value='false' ng-change="isHappyFnc(false)">
                    <span>No</span>
                </label>
            </div>
            <div>{{message}}</div>
        </div>
        <script>
            angular.module("myApp",[])
            .controller("myCtrl",function($scope, $timeout){
                $scope.isHappy = true;
                $scope.message = 'Please select !';
                
                $scope.isHappyFnc = function (value) {
                    if(value) {
                        $scope.message = 'Very Happy !';
                    }else {
                        $scope.message = 'bad mood !';
                    }
                }
            })
        </script>
    </body>
</html>

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 WeUI——單選框 layui 的單選框 html 單選框純css單選框 Vue單選框 Vue 單選框與單選框組組件 vue 實現單選框單選框的選中事件 js——單選框radio uniapp單選框使用