Question

我是Angular.js的新手，我遇到了textarea元素的问题。当我写点什么并点击添加此步骤按钮时，我放入文本区域的文本仍然存在，但我不知道原因。

HTML code：

 <div class="form-group">
  <label for="stepAdd">Step</label>
  <textarea class="form-control" rows="3"
  id="stepAdd" placeholder="Describe the solution to solve the problem step by step"
  ng-model="textStep" >
</textarea>
<a href="" class="btn btn-default" role="button" ng-click="addStep(textStep)">Add this step</a>

角度代码：

  $scope.addStep = function(text) {

    if(text === undefined) return;

    var textFormat = text.trim();
    $scope.textStep = '';
    $scope.newDoc.steps.push({
       text: textFormat,
       editing : false,
       images : []
    });

  }

Answer 1

＆＃13;

var app = angular.module('app', []);

app.controller('firstCtrl', function($scope) {
  //make sure that you define $scope.newDoc
  $scope.newDoc = {
    steps: []

  }

  $scope.addStep = function(text) {
    if (text === undefined) return;
    var textFormat = text.trim();
    $scope.textStep = '';
    $scope.newDoc.steps.push({
      text: textFormat,
      editing: false,
      images: []
    });
  };

});

＆＃13;

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app="app">
  <div ng-controller="firstCtrl">

    <div class="form-group">
      <label for="stepAdd">Step</label>
      <textarea class="form-control" rows="3" id="stepAdd" placeholder="Describe the solution to solve the problem step by step" ng-model="textStep"></textarea>
      <br/>
      <a href="#" class="btn btn-default" role="button" ng-click="addStep(textStep)">Add this step</a>


      <hr/>
      <h3>newDoc:</h3>
      <pre>  {{newDoc | json}}</pre>

    </div>
</body>

＆＃13;

AngularJS textarea的问题

1 个答案: