Question

我正在尝试学习angularJS，并且在确定如何解决这个问题时遇到了问题。我试图在用户提交表单时预先添加表单的内容。这是我的代码，但它不起作用。任何人都可以帮我找出问题所在？谢谢！

＆＃13;

angular.module("displayText", [])
  .controller("submitText", function($scope) {
    $scope.outputArr = [];
    $scope.print = function() {
        $scope.outputArr.push($scope.inputText);
        $scope.inputText = '';
      };
    };
  });

＆＃13;

<body ng-app="displayText">
  <div ng-controller="submitText">
    <form method="get" action="#">
      <input type="text" name="input" ng-model="inputText" required/>
      <button ng-click="print(inputText)">Submit</button>
    </form>
  </div>

  <div>
    <p ng-repeat="text in outputArr">{{text}}</p>
  </div>
</body>

＆＃13;

Answer 1

将这段代码放在submitText controller div

中

<div>
    <p ng-repeat="text in outputArr">{{text}}</p>
</div>

然后你的整个代码应该像

<div ng-controller="submitText">
   <form method="get" action="#">
      <input type="text" name="input" ng-model="inputText" required/>
      <button ng-click="print(inputText)">Submit</button>
   </form>

  <div>
      <p ng-repeat="text in outputArr">{{text}}</p>
  </div>
</div>

这是Plunker

在你的情况下，ng-repeat="text in outputArr"不在控制器之内，这意味着submitText控制器的范围无法被ng-repeat访问，这就是为什么它不打印任何东西

如何使用AngularJS在表单提交前添加表单内容

1 个答案: