Angularjs 角度：在下拉列表中设置默认值_Angularjs

Angularjs 角度：在下拉列表中设置默认值

angularjs

Angularjs 角度：在下拉列表中设置默认值,angularjs,Angularjs,我已经建立了一个基本上与下面的代码。我无法看到在下拉列表中选择的默认值[银行账号]。我看到那个模型正在更新。但是由于某些原因，我的默认值没有被选择。有人能帮我吗 //index.html <!DOCTYPE html> <html ng-app="app"> <head> <script data-require="angular.js@1.0.x" src="https://ajax.googleapis.com/ajax/libs/angul

我已经建立了一个基本上与下面的代码。我无法看到在下拉列表中选择的默认值[银行账号]。我看到那个模型正在更新。但是由于某些原因，我的默认值没有被选择。有人能帮我吗

//index.html
<!DOCTYPE html>
<html ng-app="app">

<head>
  <script data-require="angular.js@1.0.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js" data-semver="1.0.7"></script>
  <script src="script.js"></script>
  <script src="services.js"></script>
</head>

<body ng-controller="homeCtrl">
  <h1>Other Criteria: {{ otherCriteria.optionText }}</h1>
  <div>
    <select data-ng-model="otherCriteria"
      data-ng-options="o as o.optionText for o in criteria">
    </select>
  </div>
</body>

</html>

//services.js
app.factory("homeService", [
  "$q",
  function($q) {
    function _getDropdownValues() {
      var deferred = $q.defer();

      var dropdownValues = [{"optionValue":"Bank_Account_Number","optionText":"Bank Account Number","selected":false},{"optionValue":"Bank_Security_Number","optionText":"Bank Security Number","selected":false},{"optionValue":"Cusip","optionText":"Cusip","selected":false},{"optionValue":"Transaction_Description","optionText":"Description","selected":false}];
      deferred.resolve(dropdownValues);
      return deferred.promise;
    }

    return {
      getDropdownValues: _getDropdownValues
    }
  }
]);

//script.js
var app = angular.module("app", []);

app.controller("homeCtrl", function($scope, homeService) {

  $scope.otherCriteria = {
    optionValue: "Bank_Account_Number",
    optionText: "Bank Account Number",
    selected: false
  };

  homeService.getDropdownValues()
    .then(function(dropdownValues) {
      $scope.criteria = dropdownValues;
    })
});

//index.html
其他条件：{{otherCriteria.optionText}
//services.js
应用程序工厂（“homeService”[
“$q”，
功能（$q）{
函数_getDropdownValues（）{
var deferred=$q.deferred（）；
var dropdownValues=[{“optionValue”：“银行账户号”，“optionText”：“银行账户号”，“选中的”：false}，{“optionValue”：“银行安全号”，“optionText”：“银行安全号”，“选中的”：false}，{“optionValue”：“Cusip”，“optionText”：“Cusip”，“选中的”：false}，{“optionValue”：“交易描述”，“optionText”：“描述”，“选中的”：false}]；
deferred.resolve（dropdownValues）；
回报。承诺；
}
返回{
getDropdownValues:_getDropdownValues
}
}
]);
//script.js
var-app=angular.module（“app”，[]）；
应用程序控制器（“homeCtrl”，函数（$scope，homeService）{
$scope.otherCriteria={
optionValue:“银行账号”，
optionText:“银行账号”，
所选：false
};
homeService.getDropdownValues（）
.then（函数（下拉值）{
$scope.criteria=下拉值；
})
});

试试这个

通过集合的索引引用默认值总是一个更好的主意（不管您如何引用它）

你可以找到更多信息

基本上：Angular.JS使用本机JavaScript比较来比较对象。在JavaScript中，与Angular.JS或其他任何内容无关，比较对象（对象文字）是“通过引用”，因此它不考虑对象的相似性。仅检查比较的两个引用是否指向内存中的同一对象

通过集合的索引引用默认值总是一个更好的主意（不管您如何引用它）

你可以找到更多信息

基本上：Angular.JS使用本机JavaScript比较来比较对象。在JavaScript中，与Angular.JS或其他任何内容无关，比较对象（对象文字）是“通过引用”，因此它不考虑对象的相似性。仅检查所比较的两个引用是否指向内存中的同一对象

您还应解释其原因better@Lucas，你能解释一下为什么要这样做吗。如果我采用您的方法，则只有在加载$scope.criteria之后，我才能分配$scope.otherCriteria。与我的plunker不同，我需要先分配$scope.otherCriteria，填充页面中的其他部分，然后加载$scope.criteria。您可以在这里找到更多信息：基本上：Angular.JS使用本机JavaScript比较来比较对象。在JavaScript中，与Angular.JS或其他任何内容无关，比较对象（对象文字）是“通过引用”，因此它不考虑对象的相似性。仅检查比较的两个引用是否指向内存中的同一对象。这很有帮助。您是否可以编辑此信息并将其添加到您的答案中以接受此信息？您还应解释其原因better@Lucas，你能解释一下为什么要这样做吗。如果我采用您的方法，则只有在加载$scope.criteria之后，我才能分配$scope.otherCriteria。与我的plunker不同，我需要先分配$scope.otherCriteria，填充页面中的其他部分，然后加载$scope.criteria。您可以在这里找到更多信息：基本上：Angular.JS使用本机JavaScript比较来比较对象。在JavaScript中，与Angular.JS或其他任何内容无关，比较对象（对象文字）是“通过引用”，因此它不考虑对象的相似性。仅检查比较的两个引用是否指向内存中的同一对象。这很有帮助。您是否可以编辑此信息并将其添加到您的答案中以接受它？

 $scope.criteria = dropdownValues;
 $scope.otherCriteria = $scope.criteria[0];