当前位置: 首页 > 面试题库 >

如何在AngularJS的父控制器或范围中访问FormController

严书
2023-03-14
问题内容

我的页面有多种形式,一次只想显示一个即可。为此,我将每种形式分成一个部分,并使用Bootstrap的手风琴插件一次只允许一个打开的部分。

我的标记看起来像这样:

<a ng-click="open_section('section1')">Section 1</a>

<div collapse="section1">
  <form name="section1Form">
  </form>
</div>

<a ng-click="open_section('section2')">Section 2</a>

<div collapse="section2">
  <form name="section2Form">
  </form>
</div>

一切正常,我可以在表单之间导航。

因为我不希望用户打开当前正在编辑的部分包含验证错误的部分,所以我尝试检查open_section函数是否与其关联的表单有效。

我尝试过,但是我做不到。我无法访问负责页面的控制器中与表单关联的FormController。由于某些原因,它们没有在示波器上发布。

这是我尝试的:

  • $scope.section1Formundefined

  • 尝试过$scope.$watch('section1Form, function(){}),仍未定义

  • 尝试将表单名称添加为第二个参数,open_section例如:open_section('section1', section1Form)但是在函数中,第二个参数为undefined

<form></form>标签之间,我可以访问FormController,但是在标签之外,我没有访问权限。由于该事件来自<form>(各部分的关闭,打开)外部,因此我无法将FormController传递给控制器​​来检查表单的有效性。

有没有办法解决这个问题,还是应该重构页面?

我正在使用Angular 1.1.5 btw。

另外,通过使用AngularJS Batarang Chrome插件检查,我可以看到表单已作为子作用域发布到当前作用域。

编辑 :这是范围层次结构查找此应用程序的方式

 - root
 |
 ---current controller\'s scope
 |
 ----scope that contains the forms

这是因为我正在使用ng-include吗?那么,没有办法在控制器中访问那些表格吗?


问题答案:

为了处理动态表单以及关联的FormController的动态位置,我使用了一个简单的指令来帮助查找包含表单的范围。

解:

创建一个指令,$ emit是与该窗体关联的范围:

  module.directive('formLocator', function() {
    return {
      link: function(scope) {
        scope.$emit('formLocator');
      }
    }

在标记中使用指令:

<form name="myForm" novalidate form-locator>

监听控制器中的指令广播的事件:

$scope.$on('formLocator', function(event) {
  $scope.myDeeplyNestedForm = event.targetScope.myForm;
});


 类似资料:
  • 我尝试注入$scope,然后使用,但这不起作用? 有人能提供建议吗?

  • 问题内容: 运行期间是否可以注入示波器或控制器?或任何其他建议将服务动态注入控制器? 提前致谢 问题答案: 可以使用$ injector 将服务动态(按名称)注入到控制器中。能够通过控制器参数注入服务只是Angular提供的一种便利。在后台,Angular使用$ injector来检索对象实例。但是我们也可以自己使用$ injector。 小提琴。

  • 问题内容: 如何从其父范围调用在子范围中定义的方法? http://jsfiddle.net/wUPdW/ 问题答案: 您可以从父母到孩子使用: 工作jsfiddle:http : //jsfiddle.net/wUPdW/2/ 更新 :还有另一个版本,耦合性更低,更易于测试: jsfiddle:http : //jsfiddle.net/uypo360u/

  • 问题内容: 如果我有以下控制器: 读出的正确方法是什么?如果有必要定义中,也不会使它语义上不正确假设是描述相关的东西的属性,而不是? 更新: 对此进行进一步的思考,如果一个孩子有多个孩子,将会在检索上产生冲突。我的问题是,什么是访问的正确方法是从? 问题答案: AngularJS中的作用域使用原型继承,当在子作用域中查找属性时,解释器将从子对象开始查找原型链,并继续寻找父对象,直到找到该属性为止,

  • 问题内容: 我已经使用设置了我的控制器 我有一个父/子嵌套控制器的场景。通过使用,我可以毫无问题地访问嵌套html中的父属性,但是我无法弄清楚如何从子控制器中访问父属性。 我试过注入$ scope然后使用,但这不起作用吗? 谁能提供建议? 问题答案: 如果您的HTML如下所示,则可以执行以下操作: 然后您可以按如下方式访问父范围 如果要从视图访问父控制器,则必须执行以下操作: 参见jsFiddle

  • 问题内容: 我有以下控制器: 我想将绑定的ng模型传递给以下服务,该模型位于我的视图中… 如何连接控制器的作用域以传递到服务中?谢谢! 问题答案: 如何在angularjs中将范围从控制器传递到服务? 您不能将$ scope注入服务,没有像Singleton $ scope这样的东西。 我想将绑定的ng模型传递给以下服务,该模型位于我的视图中,即ng-model =“ symbol_wanted”