javascript - AngularJS - 在使用 ng-click 运行功能之前需要输入字段

Question

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

这是点击 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 是必需的。所以我需要在函数运行之前进行验证。我从另一篇文章中得到的片段应该可以工作，但我不知道为什么不行。

编辑 - 这是一个 fiddle :My Fiddle

现在消息框是我的，下面的另一个是别人的工作 fiddle 。我不明白为什么我的不起作用。

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

Answer 1

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

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

更新

抱歉，我第一次分享了您的 fiddle 链接。现已更新。