Question

早上，这就是发生的事情。

我做了一个开发，它工作正常，但只有firefox。当我用铬测试它时......它根本不起作用。

所以，我有一个选择，我想保存所选的值以便稍后处理它。

这是我的角色：

 if ($scope.dateTemp == "") {
     $scope.displayNotification('error', "Empty date");
 } else {
     alert($scope.dateTemp);
     //dateTemp treatment
 }

和

$scope.saveDate = function(dateMin){
            alert(dateMin);
            $scope.dateTemp=dateMin;
        };

我的观点：

<p>Select date
    <br/>
    <select ng-model="date_selection" ng-change="saveDate(dateMin)">
        <option ng-repeat="dateMin in listeDate" track by $index>{[{dateMin}]}</option>
    </select>
</p>

当我尝试这个时，我的警报未定义（顺便说一句，saveDate函数只是$scope.dateTemp的设定者）

此外，当我尝试这个时，它工作正常，但不适用于镀铬。

    <select ng-model="date_selection">
        <option ng-click="saveDate(dateMin)" ng-repeat="dateMin in listeDate" track by $index>{[{dateMin}]}</option>
    </select>

感谢您的建议。

Answer 1

您也可以在选择标记

中使用 ng-options

控制器：

app.controller('MainCtrl', function($scope) {
  $scope.listeDate = [{"value":1,"text":"date1"},
  {"value":2,"text":"date2"},
  {"value":3,"text":"date3"},
  {"value":4,"text":"date4"}];

  $scope.Print=function(){
    alert($scope.selected);
  }
});

HTML：

<body ng-controller="MainCtrl">
    <select ng-options="date.value as date.text for date in listeDate" ng-model="selected" ng-change="Print()"></select>
  </body>

工作人员link

Answer 2

track by $index应包含在ng-repeat指令中。

<select ng-model="date_selection" ng-change="saveDate(dateMin)">
        <option ng-repeat="dateMin in listeDate track by $index">{[{dateMin}]}</option>
</select>

track by是ng-repeat指令的一个选项，有助于识别数组中每个项目的唯一性。

简短的例子：

＆＃13;

function TodoCtrl($scope) {
  $scope.date_selection;
  $scope.listeDate = ['date1','date2'];
  $scope.saveDate=function(date_selection){
    console.log(date_selection);
  }
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
  <h2>Todo</h2>
  <div ng-controller="TodoCtrl">
   <select ng-model="date_selection" ng-change="saveDate(date_selection)">
        <option ng-repeat="dateMin in listeDate">{{dateMin}}</option>
   </select>
   {{date_selection}}
  </div>
</div>

＆＃13;

我测试它，它适用于chrome和mozilla。

点击和/或更改

2 个答案: