javascript - 如何将 html 表单名称获取到 Controller 中？

Question

在这里，我在 Angular Controller 中硬编码了 html 表单名称(在保存函数中)。相反，我想将表单名称放入一个变量并将其放入其中。我提到了类似的 questions , 但找不到解决方案。

HTML 格式

<section xmlns="http://www.w3.org/1999/html">
  <div class="page-header">
    <h1>{{vm.drug._id ? 'Edit Drug Information' : 'Add New Drug'}}</h1>
  </div>
  <div class="col-md-12">
    <form name="vm.form.addNewDrugForm" class="form-horizontal" ng-submit="vm.save(vm.form.addNewDrugForm.$valid)"
          novalidate>

    </form>
  </div>
</section>

Angular Controller

(function () {
    'use strict';

    // Drugs controller
    angular
        .module('drugs')
        .controller('DrugsController', DrugsController);

    DrugsController.$inject = ['$scope', '$state', '$window', 'Authentication', 'drugResolve'];

    function DrugsController($scope, $state, $window, Authentication, drug) {
        var vm = this;

        vm.authentication = Authentication;
        vm.drug = drug;
        vm.error = null;
        vm.form = {};
        vm.remove = remove;
        vm.save = save;
        vm.printDrug = printDrug;

        // Save Drug
        function save(isValid) {
            if (!isValid) {
                $scope.$broadcast('show-errors-check-validity', 'vm.form.addNewDrugForm');
                return false;
            }

            // TODO: move create/update logic to service
            if (vm.drug._id) {
                vm.drug.$update(successCallback, errorCallback);
            } else {
                vm.drug.$save(successCallback, errorCallback);
            }

            function successCallback(res) {
                $state.go('drugs.view', {
                    drugId: res._id
                });
            }

            function errorCallback(res) {
                vm.error = res.data.message;
            }
        }
    }
}());

Answer 1

您可以使用位于表单对象上的 $name 属性。对于您必须传递 vm.form.addNewDrugForm(即表单对象)以保存方法并获取 $valid 和 $name 中的属性值方法。

ng-submit="vm.save(vm.form.addNewDrugForm)"

代码

function save(form) {
   console.log('name of form', form.$name); // prints `vm.form.addNewDrugForm`
   console.log('validity of form', form.$valid); //prints `true/false`
}