我正在制作一个不是 100%“单页”驱动的应用程序。当我轻松学习这个新的 JS 框架时,我只使用 angular 作为“助手”。我的很多应用程序仍然由普通的 get 和 post 控制,而不是 angular 资源或任何东西。
我有一个由 rails 创建的外部形式(它有一个 action="" 等)。
在这个表单中,我有三个“列表”,有点像 3 种不同类型的待办事项列表,但都在一个表单中,当他们提交时将发送到 Rails。
在其中一个列表中,用户将看到一个可以添加新任务的文本框。我正在尝试使用户可以在文本框中点击“输入”并将其添加到模型中,但不提交父表单。
我读过我可以ngForm
用 angular 来做到这一点(让它看起来像嵌套形式),但我不确定如何做到这一点或有什么问题。这是我的代码:
main.js.coffee
app = angular.module("Messenger", [])
app.factory "NewTasks", ->
NewTasks = []
@processNewCtrl = ["$scope", "NewTasks", ($scope, NewTasks) ->
$scope.tasks = NewTasks
$scope.addTask = ->
task = $scope.newTask
task.timestamp = new Date().getTime()
$scope.tasks.push(task)
$scope.newTask = {}
]
@processTomorrowCtrl = ["$scope", ($scope) ->
]
视图.html.erb
<form action="/stuff">
<!-- ... boring code-->
<div ng-controller="processNewCtrl">
<!-- ... ng-repeat unordered list here for task in tasks -->
<div class="task">
<angular ng-form ng-submit="addEntry()">
<input checked="checked" disabled="disabled" type="checkbox">
<input ng-model="newTask.description" type="text" autocomplete="off" placeholder="Additional Task description">
</angular>
</div>
</div>
<!-- ... -->
</form>