Question

在这里，我在角度控制器中有硬编码的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>

角度控制器

(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

试试这种方式

var myApp = angular.module("myApp", []);

myApp.controller("myCtrl", function($scope, $element){
   alert($element.find('form').attr('name'));
   $scope.myFormName = $element.find('form').attr('name');
});

<!doctype html>
<html lang="en" ng-app="myApp">
<head>
    <meta charset="utf-8" />
    <title>Select Example - AngularJS</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script>
    <script src="script.js"></script>
</head>
<body ng-controller="myCtrl">
      <div class="col-md-12">
    <form name="vm.form.addNewDrugForm" class="form-horizontal" ng-submit="vm.save(vm.form.addNewDrugForm.$valid)"
          novalidate>
{{myFormName }}
    </form>
  </div>
</section>
</body>
</html>

Answer 2

您可以使用位于表单对象上的$name属性。因为你必须通过vm.form.addNewDrugForm（即表格对象）来保存方法＆amp;抓住$valid＆amp;方法中的$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`
}

Answer 3

试试这个

<form name="vm.form.addNewDrugForm" class="form-horizontal" ng-submit="vm.save(vm.form.addNewDrugForm.$valid,vm.form.addNewDrugForm)"
      novalidate>
</form>
function save(isValid,formaname) {
console.log (formname)
        if (!isValid) {
            $scope.$broadcast('show-errors-check-validity', 'vm.form.addNewDrugForm');
            return false;
        }

如何将html表单名称转换为控制器？

3 个答案: