Question

我有一个带有用于定义过滤器值的表单的html列表。在这种形式中有一个选择框：

<div style="...">
  <label for="lstCategory">Category:</label><br/>
  <select name="category" id="lstCategory" ng-model="category" ng-change="loadActivities()">
    <option value="0">default1</option>
    <option value="1">default2</option>
    <option ng-repeat="category in categories" value="{{ category.id }}">{{ category.id }}</option>
  </select>
</div>

在我的控制器中，我将“类别”模型绑定到REST资源：

.controller('AppointmentsHomeCtrl', [
...
function(
  ...
) {
  $scope.location = typeof $location.search().location != 'undefined' ?
    $location.search().location :
    '0';
  $scope.category = typeof $location.search().category != 'undefined' ?
    $location.search().category :
    '0';

  $scope.categories = CategoriesResource.query();

现在我想在这个选择框中预选一个值，具体取决于我的网址中的dearch参数“location”，这是由代码的$scope.category = typeof $locati.......部分完成的。

我的问题是，当mnodel本身具有正确的值时，此预选未反映到我的HTML中。

我已经尝试在查询资源完成后通过观察资源或给“查询”方法提供回调函数来设置值，但这也无效。

我错过了什么吗？解决这个问题的正确方法是什么？

编辑：

似乎认识到以下选项：

$scope.category = "foo";添加了一个被选中的伪选项。

但是当我选择existiong id时，根本没有任何事情发生：

$scope.category = "3";

Answer 1

而不是$scope.categories = CategoriesResource.query();尝试：

CategoriesResource.query().then(function(result) {
    $scope.categories = result;
});

如果结果不是数组，你可能需要调整一下......

Answer 2

在控制器上，您可以尝试使用此方法预选值

$scope.precategory = '0'; //just for example value

然后在您的html代码上确保ng-model具有不同的变量，其中ng-repeat如此

<select name="category" id="lstCategory" ng-model="precategory " ng-change="loadActivities()">
<option value="0">default1</option>
<option value="1">default2</option>
<option ng-repeat="category in categories" value="{{ category.id }}">{{ category.id }}</option>

该方法将有助于解决您的问题，因为我之前遇到了同样的问题：）

角度模型更改不会反映到html选择框

2 个答案: