小编roc*_*ist的帖子

需要默认选择Angular JS单选按钮

我是Angular JS的新手,我正在尝试创建一组单选按钮.创建按钮是很容易的部分,但我在确定如何默认选择其中一个而不破坏所有内容时遇到问题.我已经阅读过关于在Angular文档中使用ngChecked以及其他多个stackoverflow问题,但仍然无法解决这个问题.

我需要做的是在用户访问页面时预先选择一个描述.price,discount和deal_value也需要与预选的price_option对象中的值一起显示.

这是我试图开始工作的代码:http://jsfiddle.net/qWzTb/311/

HTML代码:

<body ng-app="demoApp">
    <div ng-controller="DemoController" ng-init="init([{qty: 1, price:10, qty_description:'descrip 1', discount:'1%', deal_value:200}, {qty: 2, price:7, qty_description:'descrip 2', discount:'5%', deal_value:100}])">  

       <div>
           <label ng-repeat="price_option in price_options">
              <input type="radio" ng-model="init.price_option" ng-value="price_option" ng-checked="selected_price_option" name="quantity"/>
              {{ price_option.qty_description }}
           </label>
           <ul>
              <li>{{ init.price_option.price }}</li>
              <li>{{ init.price_option.discount }}</li>
              <li>{{ init.price_option.deal_value }}</li>
           </ul>
        </div>
    </div>
</body>
Run Code Online (Sandbox Code Playgroud)

使用Javascript:

angular.module('demoApp', []).controller('DemoController', function($scope) {

  $scope.init = function(prices) {
    $scope.price_options = prices;
    $scope.selected_price_option = $scope.price_options[0];
  };
});
Run Code Online (Sandbox Code Playgroud)

html javascript angularjs

5
推荐指数
1
解决办法
2万
查看次数

标签 统计

angularjs ×1

html ×1

javascript ×1