Question

所以我从JSON页面返回了一个PHP对象。它包含帐户的ID，名称和编号。我可以在页面上重复这些内容，但是当我使用ng-option时，它似乎无法正常工作。

这有效：

<p ng-repeat="account in accounts">
     ID: {{account.id}}<br>
     Name: {{account.name}}<br>
     Number: {{account.phone}}
</p>

但这不是：

<select class="form-control input-sm" id="accountSelect" 
     ng-model="option.account" 
     ng-options="account.id as account.name for account in accounts">
</select>

这是我设置option.account：

的地方

$scope.option={
    account: $scope.accounts[0].id
};

这是我的控制器代码，有些东西已编辑出来，只关注问题区域。

app.controller('CheckCallsCtrl', ['$scope', '$http', function($scope, $http){

getAccountTickets(1940713);

function getAccountTickets(callerID){

        $scope.searchTicket="";

        var request = $http({
            method: "post",
            url: "scripts/getTickets.php",
            data: {
                phone : callerID
            },
            headers: {'Content-Type': 'application/x-www-form-urlencoded'}
        });

        request.success(function(data){

            $scope.accounts = data.Account.Account;

            $scope.option={
                account: $scope.accounts[0].id
            };

            console.log($scope.option.account);

            $scope.noTickets = false;
            $scope.ticketData = data;

            $scope.openTickets = $scope.ticketData.open;

            $scope.last30 = $scope.ticketData.last30;

            $scope.openAlerts = $scope.ticketData.openAlerts;

            $scope.last30Alerts = $scope.ticketData.last30Alerts;
        });

        request.error(function(data){
            console.log(data);
        });

    }

}]);

问题是否存在，因为我在页面加载后从$http请求中获取了数据？

Answer 1

请检查demo。看看你是否缺少关闭括号或控制器脚本的一部分。

<强> HTML

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.accounts = [ {id:1,name:'test1', phone:'1234567890'},
                    {id:2,name:'test2', phone:'1234567890'},
                    {id:3,name:'test3', phone:'1234567890'}
                  ];

$scope.option={
                  account: $scope.accounts[0].id
              }
});

<强> SCRIPT

var data = {
    "Something": true,
    "Something else": false,
    "Blah": false,
    "a fish ISA": true
};

Answer 2

您确定在填充帐户时设置$scope.option吗？

＆＃13;

angular.module('MyApp', []).
controller('MyController', ['$q','$scope',
  function($q,$scope) {
    var deferred = $q.defer()
    setTimeout(function(){
      deferred.resolve([{id:0,name:'zero',phone:'555-555-5555'},
                     {id:1,name:'one',phone:'555-555-5555'},
                     {id:2,name:'two',phone:'555-555-5555'},
                     {id:3,name:'three',phone:'555-555-5555'}]);
      },1000);
    
    deferred.promise.then(function(data){ 
      $scope.accounts = data;
      $scope.option = {
        account: $scope.accounts[0].id
      };
   });
  }
]);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="MyApp" ng-controller="MyController">
  <p ng-repeat="account in accounts">
    ID: {{account.id}}
    <br>Name: {{account.name}}
    <br>Number: {{account.phone}}
  </p>
  <pre>{{option.account}}</pre>
  <select class="form-control input-sm" id="accountSelect" ng-model="option.account" ng-options="account.id as account.name for account in accounts">
  </select>


</div>

＆＃13;

Answer 3

在您的情况下，尝试将控制器var名称预先添加到帐户var。

<select ... ng-options="ccount.id as account.name for account in CONTROLLER.accounts">

Ng-options没有填充

3 个答案: