angularjs文本区域-如何使其与angularjs下拉列表中的选定值保持同步

angularjs textarea - how to keep it in sync with angularjs dropdowns selected values

本文关键字：angularjs 同步 下拉列表 区域 文本 何使其      更新时间：2023-09-26

我有几个下拉菜单，根据选择我更新了文本区域的内容，但当我试图更新文本时，我认为函数会被触发，不允许我更新。

这是我的html:

 <textarea  ng-model="desc" ng-change="des"></textarea>

和角度

不知怎么代码被删除了。。请访问plunker：http://plnkr.co/edit/pVSiNrnAOY0A5v0iTmYQ?p=preview

最好使用watch函数，尤其是在控制器中的值可能发生变化的情况下，因为这可以确保它们保持同步。这个解决方案似乎也更容易看出发生了什么：plunkr解决方案

只需使用手表功能即可观看所选值：

 $scope.$watch('selectedId', function(newValue){
    $scope.d();
  });

我不确定您是否希望用户能够更改文本区域中的值。如果您不这样做，就像您的例子一样，那么我建议您将属性ng-disabled="true"添加到文本区域。

您还需要

$scope.des = function() {
    return $scope.d()
  }

不确定你想做什么，但如果你刚刚把这个砸了

// Code goes here
app = angular.module('myapp',[]);
app.controller('main', function($scope) {
  $scope.desc = "";
  $scope.stat = "test";
  $scope.d = function() {
    for (var i = 0, len = $scope.stat.length; i < len; i++) {
      if ($scope.stat[i].Id == $scope.selectedId && $scope.statDate == $scope.stat[i].StatDate) {
        $scope.desc = $scope.stat[i].D;
        return $scope.stat[i].D;
      }
    }
    return "";
  };
  $scope.des = function() {
    return $scope.d()
  }
});

我明白你的问题，如果我评论

// $scope.desc = $scope.stat[i].D;

它有效，但我想你需要的是：）

你想做什么？我认为，随着观点的改变，你们正试图改变模式。你可能需要一个指示。

这是我为约会时间做的事情的一部分

.directive('formatteddate', function ($filter) {
    return {
        link: function (scope, element, attrs, ctrl) {
            ctrl.$parsers.unshift(function (viewValue) {

这是你的代码的砰砰声.html。

http://plnkr.co/edit/3GjP7YVsKFIYAAJQwmOK?p=preview

好吧，那么如果您只是将textarea的ng模型值更新为您选择的下拉列表的值呢。

这是plunkerhttp://plnkr.co/edit/mXQTcBu5rOJaQJKEFKpm?p=preview

将型号名称更改为：

 <textarea ng-model="textarea" ng-change="desc()"></textarea>

然后在脚本中更新，代码逻辑为：

$scope.d = function() {
    for (var i = 0, len = $scope.stat.length; i < len; i++) {
      console.log(i);
      if ($scope.stat[i].Id == $scope.selectedId && $scope.statDate == $scope.stat[i].StatDate) {
        $scope.desc = $scope.stat[i].D;
        **$scope.textarea=$scope.desc;**
        return $scope.stat[i].D;
      }
    }
    return "";
  };
相关文章：