0

我创建了一个 angularJS 选择框，它将根据选择框中的选定值过滤表中的结果。

现在，选择框是使用以位置为键的对象“user['location']”创建的。此外，我会在页面加载后立即获取默认用户位置“${city}”，将其传递到我的选择框，并在表格中相应地过滤结果。

如果用户的当前位置与我的选择框中的任何选项都不匹配，则不应应用过滤器！

例如，如果用户位置是“伦敦”，因为在我的对象中没有像“伦敦”这样的东西，它应该选择第一个选项 - “选择城市”。

但目前它正在创建一个像上面那样的空字符串<option value= "? string:London ?"></option>并正在选择它！

怎么解决？

这是我的代码：

HTML：

<select class="form-control" ng-model="user.loc" ng-init="user.loc = '${city}'">
  <option value="" ng-selected="!checkKey(user.loc)">Select City</option>            
  <option value="{{key}}" ng-selected="key == user.loc" ng-repeat="(key, value) in user['location']">{{key}}</option> 
</select>

JS：

$scope.user['location'] = {Sydney: 5, Hong Kong : 7, NYC : 3, Toronto: 1};

$scope.checkKey = function(loc) {
  if(loc in $scope.user['location']){
    return true;
  } else {
    return false;
  }            
};
4

2 回答 2

1

我想我明白你在这里想要做什么。checkKey但是，您可以在加载控制器时执行一次，而不是使用检查值。

此外，您可以利用ngOptions在选择框中呈现可用选项。

angular.module('myapp', [])
  .controller('myctrl', function($scope) {
    $scope.user = {};
    $scope.user['location'] = {
      'Sydney': 5,
      'Hong Kong': 7,
      'NYC': 3,
      'Toronto': 1
    };
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="myapp" ng-controller="myctrl">
  <select class="form-control" ng-model="user.loc" ng-init="user.loc = user.location['London']" ng-options="value as key for (key, value) in user.location">
  <option value="">Select City</option>
</select>
</div>

你可以改变ng-init你自己的价值，就像你做的那样，它应该可以正常工作。

于 2017-12-01T09:25:54.507 回答
0

好的，我试过了，它奏效了！

<select class="form-control" ng-model="user.loc">
  <option value="" ng-selected="!checkKey(user.loc)">Select City</option>            
  <option value="{{key}}" ng-selected="key == '${city}'" ng-repeat="(key, value) in user['location']">{{key}}</option> 
</select>
于 2017-12-01T09:30:37.237 回答