用 1.5 引用 Angular 形式

Question

我有一个 angular 指令 (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

Answer 1

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

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

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

<form name='$ctrl.myForm'>

用 1.5 引用 Angular 形式

Referencing Angular form with 1.5

angularjs

angularjs-components

angularjs-forms