Javascript Angular.js控制器

Javascript Angular.js控制器,javascript,html,forms,angularjs,partials,Javascript,Html,Forms,Angularjs,Partials,注意:很抱歉这篇文章太长了,但我决定不把它分解成单独的问题是因为我发现如果没有像这样复杂的问题,这些问题很难解决。我感到眼花缭乱,有点害怕,我试图强迫Angular为我做一些事情,这不是“Angular方式”我们将非常感谢您的任何建议,这可能会让我与Angular一起走上正确的道路。 我的问题如下: 我有一个动态生成的表单,由myFormCtrl控制。我想变得非常模块化:我想随时随地使用它。这意味着,有时我需要按原样将其放置在某个位置,有时我需要动态嵌套表单(例如,当我更改表单值时,会出现其他子

注意:很抱歉这篇文章太长了,但我决定不把它分解成单独的问题是因为我发现如果没有像这样复杂的问题,这些问题很难解决。我感到眼花缭乱,有点害怕,我试图强迫Angular为我做一些事情,这不是“Angular方式”我们将非常感谢您的任何建议,这可能会让我与Angular一起走上正确的道路。

我的问题如下: 我有一个动态生成的表单,由
myFormCtrl
控制。我想变得非常模块化:我想随时随地使用它。这意味着,有时我需要按原样将其放置在某个位置,有时我需要动态嵌套表单(例如,当我更改表单值时,会出现其他子表单),或者通过父控制器在视图中控制两个单独的表单,并为这两个表单设置一个“保存”按钮。
myFormCtrl
使用
$scope.type_id
$scope.rowid
来知道应该从数据库中显示哪个记录。然后,记录由服务获取,并保存在
myFromCtrl
$scope.formItems
下。保存后,表单将数据发送回服务器(通过服务),并带有类型\ id和范围凭据,因此restful api知道将记录放在何处

从理论上讲,在Angular.js中这样做非常容易。 它肯定会出现在每种面向对象的语言中:父类可以调用
getFormValues()
myFormCtrl
的公共方法。现在这不能在Angular中完成:父对象不能读取子对象的范围

对我来说,这似乎不是一个简单的“控制器之间如何通信”问题。我知道这个问题的答案是服务、事件和范围继承

此外,我找到的每个解决方案似乎都会产生一些其他问题

所以我有一个myFormCtrlBase类,它做基本的东西,其他更高级的类扩展了这个类。我还有一个
formControls.html
,还有一个
formLayout.html
partial。第一个包含一个ng开关,并根据
$scope.formItem.controltype
提供适当的输入元素,第二个具有通用表单的html布局,ng在正确的位置包括formControls.html。它利用了ng repeat=“formItem in formItems”,因此formControls.html的
$scope.formItem
就是从这里来的

例如,当我希望表单具有不同的布局时,我会创建一个由
myFormCtrl
类控制的
customFormLayout.html
partial ng

第一个问题:如果我的表单布局不能放在ng repeat中怎么办

比如表单元素需要分散放置在页面上,或者表单布局不适合ng重复循环。我的
formControls.html
仍然需要使用
$scope.formItem
。简单的OO解决方案:家长将formItem放在孩子的范围内。 我的解决方案:我创建了一个
指令,该指令将formItems[1]作为属性,并将其转换为$scope.formItem变量。这种解决方案感觉很混乱:指令不应该这样使用。看起来不是很有棱角。这真的是最好的解决方案吗

第二个问题:ng init真的那么邪恶吗

比如说,表单不是由
$routeProvider
放在视图中,而是放在一个自定义部分:rent-a-car.html中。在这里,我想有一个表单,用户可以选择一辆车,还有一个表单,我可以从中获取他的联系人。这两个表单使用不同的
$scope.type_id
,因此需要两个不同的表单:

<h1>Rent a car!</h1>
<div ng-controller="myFormCtrl" ng-init="type_id='rentOrder'">
  <div ng-include="'formLayout.html'"></div>
</div>
<h2>Your contact information</h2>
<div ng-controller="myFormCtrl" ng-init="type_id='User';rowid='{{userData.rowid}}'">
  <div ng-include="'formLayout.html'"></div>
</div>
租车!
您的联系信息
Angular docs说,唯一适当使用ng init的方法是对重复值进行别名化。我看不出上面的例子有什么问题——它仍然是最干净的解决方案,不是吗

我对嵌套表单使用了相同的技术—我将一个控制器与一个模板放在一起,通过ng init从html初始化,并使用ng if条件显示/隐藏

顺便说一句,除了编写新的控制器(扩展
myFormCtrlBase
)之外,这是我发现的唯一真正的初始化技术。在OO语言中,父对象将写入子对象的作用域,然后对其进行初始化。 也许我的方法受到了我以前使用的语言和编程技术的影响,这是完全错误的

有些人会说,‘从父作用域获取初始值!’,但我似乎不明白这是如何安全有效的。我需要对每个作用域属性执行
$scope.type_id=($scope.type_id | |$routeParams.type_id)
,第一个:看起来很不好看,第二个:很危险。可能这是一个简单模板中的一个表单,但在范围层次结构中的某个地方,它可能会找到一个完全不同的type\u id。可能它将是一个完全不同的控制器的type\u id

我看不出在我的范围变量中使用'.'-s会有什么帮助。我的风险和我看到的一样

第三个问题:如何处理rentACar.html提交

当点击my rentACar.html页面上的保存按钮时,
rentACarCtrl
(负责视图模型的控制器)应该以某种方式检索两个表单的值,并处理验证和提交。我似乎无法理解“控制器通过服务进行通信”这一常见咒语在这里是如何适用的。仅针对这两种形式的服务

我走对了吗?这些解决方案中的每一个看起来都很古怪。我感到失落:)


+1问题:即使经历了这么多的麻烦,我似乎也找不到一个好的理由来解释为什么Angular不让父母把孩子的事情称为公共事务。有充分的理由吗?上述大多数问题在每个真正的OO js框架中都有一个简单的答案。

您需要考虑如何解决这些问题