AngularJS 联系表单应用与当前 app.js 合并

Question

这是我当前的 angular app.js，我希望它与 website.js.

一起使用

    'use strict';

// angular.js main app initialization
var app = angular.module('kaidoweb', []).
    config(['$routeProvider', function ($routeProvider) {
      $routeProvider.
        when('/', {
         templateUrl: 'pages/index.html',
         activetab: 'index',
         controller: HomeCtrl 
       }).
       /* when('/mainpage/:mainpageId', {
          templateUrl: function (params) { return 'pages/' + params.mainpageId + '.html'; },
          controller: ProjectCtrl,
          activetab: 'mainpage'
        }).*/
        when('/works', {
          templateUrl: 'pages/works.html',
          controller: PrivacyCtrl,
          activetab: 'works'
        }).

        otherwise({ redirectTo: '/' });
    }]).run(['$rootScope', '$http', '$browser', '$timeout', "$route", function ($scope, $http, $browser, $timeout, $route) {

        $scope.$on("$routeChangeSuccess", function (scope, next, current) {
          $scope.part = $route.current.activetab;
        });


        // save the 'Contact Us' form
        $scope.save = function () {
          $scope.loaded = true;
          $scope.process = true;
          $http.post('sendemail.php', $scope.message).success(function () {
              $scope.success = true;
              $scope.process = false;
          });
        };
  }]);

app.config(['$locationProvider', function($location) {
    $location.hashPrefix('!');
}]);

这是获取联系表工作教程的网站应用程序http://sarahcapecci.com/blog/processing-a-form-with-angularjs-php/

    // creating Angular Module
  var websiteApp = angular.module('websiteApp', []);
  // create angular controller and pass in $scope and $http
  websiteApp.controller('FormController',function($scope, $http) {
  // creating a blank object to hold our form information.
  //$scope will allow this to pass between controller and view
  $scope.formData = {};
  // submission message doesn't show when page loads
  $scope.submission = false;
  // Updated code thanks to Yotam
  var param = function(data) {
        var returnString = '';
        for (d in data){
            if (data.hasOwnProperty(d))
               returnString += d + '=' + data[d] + '&';
        }
        // Remove last ampersand and return
        return returnString.slice( 0, returnString.length - 1 );
  };
  $scope.submitForm = function() {
    $http({
    method : 'POST',
    url : 'process.php',
    data : param($scope.formData), // pass in data as strings
    headers : { 'Content-Type': 'application/x-www-form-urlencoded' } // set the headers so angular passing info as form data (not request payload)
  })
    .success(function(data) {
      if (!data.success) {
       // if not successful, bind errors to error variables
       $scope.errorName = data.errors.name;
       $scope.errorEmail = data.errors.email;
       $scope.errorTextarea = data.errors.message;
       $scope.submissionMessage = data.messageError;
       $scope.submission = true; //shows the error message
      } else {
      // if successful, bind success message to message
       $scope.submissionMessage = data.messageSuccess;
       $scope.formData = {}; // form fields are emptied with this line
       $scope.submission = true; //shows the success message
      }
     });
   };
});

所以我已经在使用 <html ng-app="kaidoweb"> 并且它不允许我使用另一个 ng-app。我单独尝试过它，它似乎可以工作，但我无法将其与当前应用程序一起使用。

那么有没有办法以某种方式或其他标准方式合并它们。 此外，如果有更好、更简单的方法来做到这一点，并且知道一些很好的例子，我也会很感激。

Answer 1

由于您已经创建了一个 module，所以这个：

var app = angular.module('kaidoweb', []);

您不需要再创建一个。你应该做的是使用你的，只使用教程中的 FormController。

此外，我认为您不需要使用评论中的代码 //save the 'Contact Us' form，因为您将用教程中的函数替换此函数。

那你就可以拿我说的控制器，插在你的app的末尾，然后跟着剩下的。

我不是高级 AngularJS 用户，但据我所知，这应该可行。至少对我来说，它是有效的。

AngularJS 联系表单应用与当前 app.js 合并

AngularJS contact form app merge with the current app.js

javascript

php

forms

contact

angularjs