AngularJS - 在使用 ng-click 运行函数之前需要输入字段

Question

我需要确保用户在使用 ng-click 提交表单之前将消息放入 textarea 框中。

这是点击 ng-click 时要运行的函数：

$scope.reject = function() {
  $http.post( 'http://server.com/api/reject/' + carID, { Message: Message } ).
  success(function(data) {
    $scope.output = data;
  })
}

这是我的 HTML：

<div id="reject" class="animated">
  <h3>WARNING</h3>
  <p>Your are about to <strong><u>REJECT</u></strong> this CAR. Are you sure this is the action that you want to take?</p>
  <form name="reject">
    <textarea placeholder="Message" ng-model="Message" ng-required="true"></textarea>
    <button ng-click="reject.$valid && reject()">Reject</button>
  </form>
</div>

我的 HTML ng-click 代码来自 this SO post:

<form name="myform">
  <input type="text" ng-model='name' ng-required="true" />
  <button ng-click="myform.$valid && preview()">Preview</button>
  <button ng-click="myform.$valid && update()">Update</button>
</form>

但由于某种原因，这对我不起作用。如果我删除 forward.$valid && 并将其设置为 ng-click="reject() 它运行得很好，尽管我仍然可以在不输入消息的情况下运行它。我需要 textarea 是必需的。所以我需要在函数运行之前进行验证。我从其他帖子下的 sn-p 应该可以工作，但我不知道为什么不行。

编辑 - 这是一个小提琴：My Fiddle

现在消息框是我的，下面的另一个是其他人的工作小提琴。我不明白为什么我的不工作。

谁能告诉我我做错了什么？

Answer 1

我在您的工作预览函数中插入了一个 console.info，发现您在 $scope 上的拒绝值正在注册为构造函数。我只能猜测你找到了一个关键字。我将函数的名称更改为reject2，它作为一个函数出现并运行您请求的警报。这是一个有效的fiddle

$scope.reject2 = function() {
    alert("hi");
  }
ng-click="reject.$valid && reject2()

更新

对不起，我第一次分享了你的小提琴链接。现在更新了。

Answer 2

您需要将reject 更改为<form> 和ng-click 以及其他任何地方的其他内容。这是一个受保护的关键字。