无法使用离子在选择选项中显示多个数据

时间:2016-10-10 11:38:28

标签: html angularjs ionic-framework

我想显示从数据库中获取的数据,实际上我得到了2个数据,但我的选择选项中只显示了一个数据。

我的控制器中的代码就是这个。

        var link = 'http://127.0.0.1/mobile/subject.php';
        var userid = JSON.parse(localStorage.getItem('loginDetails'));
        console.log(userid);


        $http.post(link, {userid: userid}).success(function(data){
        console.log(data);

        for(i = 0; i<data.length; i++){
        $scope.subject = data[i].SubjectName;
        //$("#datas").append("<div>"+$scope.subject+"</div>")
        } 

        })
        .error(function(err) {
        console.log(err)
        });

我的html代码看起来像这样{{subject}}我只将{{subject}}放在我的选项上,我认为这部分应该循环显示多个数据。

这是我从数据库first data

中检索到的数据

2nd data

但这是我的选择选项中显示第二个数据的唯一数据.. [select option data[3]

任何帮助将不胜感激谢谢:D我是新手,所以我感到困惑。

1 个答案:

答案 0 :(得分:0)

您需要在前端循环每个主题,例如选项或ng-option上的ng repeat。现在,您尝试显示它的方式只会显示数组中的最后一项。请尝试从此处获取的以下代码,但需要对其进行自定义以适合您的工作。 https://docs.angularjs.org/api/ng/directive/select

<div ng-controller="ExampleController">
<form name="myForm">
<label for="mySelect">Make a choice:</label>
<select name="mySelect" id="mySelect"
  ng-options="option.name for option in data.availableOptions track by option.id"
  ng-model="data.selectedOption"></select>
</form>
<hr>
<tt>option = {{data.selectedOption}}</tt><br/>
</div>

另一个例子,但是你需要在某些方面改变它,但结构应该保持不变:

<select ng-model="filterCondition.sub">
   <option ng-selected="{{sub.value == filterCondition.sub}}"
        ng-repeat="sub in subject"
        value="{{sub.value}}">
     {{sub.displayName}}
   </option>
</select>