【问题标题】:Angular JS Action on ng-change the select dropdownAngular JS Action on ng-change 选择下拉菜单
【发布时间】:2015-06-06 10:54:53
【问题描述】:

我有一个简单的表,其中包含三行和每行两个值 - 日期和状态:

<tbody>
   <tr>
      <td>Red</td>
        <td class="lastModified">{{item.redDate}}</td>
        <td class="status"> 
            <select id ="red" class="form-control" ng-change="update();" ng-model="item.redStatus">
              <option value="" disabled="" selected="" class="ng-binding">Please select the value</option>
              <option ng-selected="step.value === item.redStatus"  ng-repeat="(key, step) in steps">{{ step.title }}</option>
            </select>
       </td>
   </tr>
   <tr>Green</tr>
   <tr>
     ....
   </tr>                    
</tbody>

因此,红色、绿色和蓝色的简单日期和状态值。 下拉列表中的一个 - 状态,第二个 - 只是输出日期。

在更改选择值时 - 我需要用今天的日期更新日期。

 `$scope.item.redDate = new Date();`

是否可以有一个像ng-change="change();"这样的功能 无法通过 ng-change ID 发送...

【问题讨论】:

  • 为什么不能?您可以在 update() 方法中将 ID 作为参数发送,例如 ng-change = "update('red')" 究竟是什么问题?
  • 嗯...是的,那我如何更新日期?如果是 $scope.item.redDate?在 JS 中,我会写类似 var date = id +'Date'
  • 喜欢这个 $scope.item[id+'Date'] = new Date();
  • 所以,函数应该像 $scope.update= function(id){ alert('id' + id); $scope.item[id+'Date'] = new Date(); };但是警告说,那个 Id 是 undefined 。 ng-change="update(id);"
  • 哦,您正在发送直接 ID。我以为你会传递颜色名称,例如 ng-change="update('red');"

标签: angularjs select scope angularjs-ng-change


【解决方案1】:

特别感谢 Samir Das 帮助找到解决方案 ng-change="update(id);"

<select id ="red" class="form-control" ng-change="update(id);" ng-model="item.redStatus">
          <option value="" disabled="" selected="" class="ng-binding">Please select the value</option>
          <option ng-selected="step.value === item.redStatus"  ng-repeat="(key, step) in steps">{{ step.title }}</option>
 </select>

这里是控制器:

$scope.update = function(id){
    id = event.target.id;
    $scope.item[id+'Date'] = new Date();
 };

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2018-05-26
    • 1970-01-01
    • 2022-11-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多