从范围角度的数组值中显示单选按钮数据

时间:2015-01-27 07:06:29

标签: javascript angularjs html5

我有网络服务电话。我收到了webservice的回复:

var SSOUserResponse = [
                  {
                      "UserName": "se",
                      "FirstAndLastName": "Sam ",
                      "EmailAddress": "segfgf@x.net"
                  },
                  {
                      "UserName": "se2",
                      "FirstAndLastName": "Joe ", //
                      "EmailAddress": "se266@gmail.com" //
                  }
                ];

SSOUserResponse数组length我也可以。

$scope.launchArray = [];

我想在我的模板中显示这些数据。

我在做什么:

if (SSOUserResponse.length > 1) {
                    var launchArrayVal = [];
                    for (var i = 0; i < SSOUserResponse.length;i++){
                        launchArrayVal.push(
                          { name: SSOUserResponse[i].UserName, email: SSOUserResponse[i].EmailAddress }
                        );
                        $scope.launchArray = launchArrayVal;
                    }
}

我有一个模板:

<div class="modal-body">
                <div>Please select an one data</div>
                <div>
                    <input type="radio" ng-model="launchArray" name="group1" value="{{launchArray.name}}">
                </div>
            </div>

我想显示带有用户名和电子邮件的单选按钮以显示.. 我也试过了ng-repeat。它不起作用。

你可以指导我做错了什么或我能做什么吗?

2 个答案:

答案 0 :(得分:2)

结帐this

<div class="modal-body">
        <div>Please select an one data</div>
        <div ng-repeat = 'item in launchArray'>
            <input type="radio" ng-model="selected.value" name="group" ng-value="item.name">
            <div> Name : {{item.name}}</div>
            <div> Email : {{item.email}}</div>
        </div>
    </div>
    <br>
    <br>
    <br>
    <br>
    <div >
      <b>Selected Value :: </b>{{selected.value}}
    </div>



  var SSOUserResponse = [
                  {
                      "UserName": "se",
                      "FirstAndLastName": "Sam ",
                      "EmailAddress": "segfgf@x.net"
                  },
                  {
                      "UserName": "se2",
                      "FirstAndLastName": "Joe ", //
                      "EmailAddress": "se266@gmail.com" //
                  }
                ];

  if (SSOUserResponse.length > 1) {
      var launchArrayVal = [];
      for (var i = 0; i < SSOUserResponse.length;i++){
          launchArrayVal.push(
            { name: SSOUserResponse[i].UserName, email: SSOUserResponse[i].EmailAddress }
          );
      }

    $scope.launchArray = launchArrayVal;
    $scope.selected = {value: null};
  }

答案 1 :(得分:1)

你想为每个结果显示一个单选按钮,对吗?

这是你使用ng-repeat的时候。您没有提到使用ng-repeat时出现的问题。

目前,在您的模板中,您正在执行{{launchArray.name}}这不起作用,因为launchArray是一个数组......它没有name属性。

使用ng-repeat,循环遍历launchArray中的每个项目,并每次渲染一个单选按钮:

<div class="modal-body">
                <div>Please select an one data</div>
                <div ng-repeat="item in launchArray">
                    <input type="radio" name="group1" value="{{item.name}}">
                    <span>{{item.name}} ({{item.email}})</span>
                </div>
            </div>