我在表格下方的 div 中创建了一个工作表单;
<div class="row">
<form class="form-signin" ng-submit="controller.add.save()">
<h2 class="form-signin-heading">Add an item:</h2>
<label for="inputName" class="sr-only">Name</label>
<input type="text" name="name" id="inputName" class="form-control" placeholder="Name" required autofocus ng-model="controller.add.name">
<label for="inputDescription" class="sr-only">Description</label>
<textarea name="description" id="inputDescription" class="form-control" placeholder="Description" ng-model="controller.add.description">
</textarea>
<button class="btn btn-lg btn-primary btn-block" type="submit">Add</button>
</form>
</div>
然后我决定将表格移到上面的表格中;
<tr>
<form ng-submit="controller.add.save()">
<td>Add an item</td>
<td><input type="text" name="name" id="newName" class="form-control" placeholder="Name" required ng-model="controller.add.name"></td>
<td><textarea name="description" id="newDescription" class="form-control" placeholder="Description" ng-model="controller.add.description"></textarea></td>
<td><button class="btn btn-xs btn-primary" type="submit">Add</button></td>
</form>
</tr>
但是现在表单不再起作用了。 我做错了什么?
最佳答案
您这样做的方式不会在页面上正确呈现 html,因为根据表格标准,它的 html 无效。基本上在幕后,html 渲染器会在页面上渲染 html 时将其从 table
标记中抛出。因此,为了在表格标签中包含表单,您可以使用 ng-form
属性而不是 form
元素。
但是通过使用 ng-form
指令你不能有 ng-submit
指令,你应该只通过 button
提交表单。
HTML
<tr ng-form="myForm">
<td>Add an item</td>
<td><input type="text" name="name" id="newName" class="form-control" placeholder="Name" required ng-model="controller.add.name"></td>
<td><textarea name="description" id="newDescription" class="form-control" placeholder="Description" ng-model="controller.add.description"></textarea></td>
<td><button class="btn btn-xs btn-primary" type="button" ng-click="controller.add.save()">Add</button></td>
</tr>
关于表的结构更详细的解答,可以引用this answer
关于html - Angular 形式在表格中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34443885/