在 Angular 中的页面加载时提交表单

Question

如果在路由中指定了搜索词，我想在页面加载时提交搜索表单。问题是searchForm 在search() 运行时尚未定义。我已经看到其他人通过将 ng-controller 放在表单元素上来实现此功能，但我在此页面上有多个表单，因此控制器必须是表单的父级。

如何确保在调用 search() 时定义了表单？

myModule.controller('MyController', ['$scope', '$routeParams',
function($scope, $routeParams){
  $scope.model = {searchTerms: ""};

  $scope.search = function(){
      if($scope.searchForm.$valid){
          ...
      }
  };

  if($routeParams.terms !=""){
      $scope.model.searchTerms = $routeParams.terms;
      $scope.search();
  }
}]);

查看：

<div ng-controller="MyController">
  <form name="searchForm" ng-submit="search()">
      ...
  </form>
  <form name="detailForm" ng-submit="save()">
      ...
  </form>
</div>

Answer 1

这似乎有效：

$scope.$on('$routeChangeSuccess', function () {
    if($routeParams.terms !=""){
        $scope.model.searchTerms = $routeParams.terms;
        $scope.search();
    }
});

Answer 2

您是否尝试过在 searchForm 上仅使用 $watch？

if($routeParams.terms != "") {
    var unregister = $scope.$watch(function() {
        return $scope.searchForm;
    }, function() {
        // might want to wrap this an if-statement so you can wait until the proper change.
        unregister(); //stop watching
        $scope.model.searchTerms = $routeParams.terms;
        $scope.search();

    });
}