angularjs textarea - 如何使其与 angularjs 下拉菜单中的选定值保持同步

Question

我有几个下拉菜单，并根据选择更新了文本区域内容，但是当我尝试更新文本时，我认为该功能被触发了，并且不允许我更新。

这是我的 html :

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

和angular

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

Answer 1

你还需要

$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) {

这是你的code/html。

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

Answer 2

最好使用监视功能，尤其是当控制器中的值可能发生变化时，因为这样可以确保它们保持同步。这个解决方案似乎也更容易看到发生了什么： plunkr solution

仅使用监视功能监视所选值：

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

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

Answer 3

好的，那么如果您只是将 textarea 的 ng-model 值更新为 select 下拉列表的值呢？

这是笨蛋 http://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 "";
  };

angularjs textarea - 如何使其与 angularjs 下拉菜单中的选定值保持同步

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

javascript

angularjs

angularjs-directive

angularjs-scope

angularjs-ng-repeat