用 1.5 引用 Angular 表单答案

【问题标题】：Referencing Angular form with 1.5用 1.5 引用 Angular 表单
【发布时间】：2016-11-25 09:04:28
【问题描述】：

我有一个角度指令 (1.4) 我正在切换到组件语法 (1.5)。如果单击表单重置按钮，现有代码将调用 form.$setPristine()。当我将它切换到一个组件并尝试从 jasmine 测试中调用时，表单变量是未定义的。

  ctrl.resetForm = function () {
    ctrl.employee = {};
    ctrl.myForm.$setPristine();
  };

测试文件：

  $scope = $rootScope.$new();
  $scope.myForm = jasmine.createSpyObj('myForm', ['$setPristine']);

  ctrl = _$componentController_(
  'myComponent', {
    $scope: $scope,
    EmployeeSvc: EmployeeSvc,
    LoggingSvc: LoggingSvc,
    SessionSvc: SessionSvc
  });
  ctrl.$onInit();

form.html

 <form name="myForm" class="form" novalidate>

错误：

debug.html:38 TypeError: Cannot read property '$setPristine' of undefined

【问题讨论】：

模板代码是什么？你是否尝试过像ctrl.myForm = {}这样初始化表单
如果您可以在 plunker 中提供一些东西会有所帮助。

标签： angularjs angularjs-components angularjs-forms

【解决方案1】：

在组件控制器初始化后设置 spy。 $scope 不需要传入。

ctrl = _$componentController_(
'sbEmployeeCreate', { 
     EmployeeSvc: EmployeeSvc,
     LoggingSvc: LoggingSvc,
     SessionSvc: SessionSvc
});
ctrl.$onInit();
ctrl.myForm = jasmine.createSpyObj('myForm', ['$setPristine']);

在模板中，使用 $ctrl 作为表单名称。

<form name='$ctrl.myForm'>

【讨论】：