使用角度跨过域名发布表单数据

我是新角色js。我已经创建了页面，我必须将数据发布到其他html页面，然后我必须使用angular来接收其他页面中的数据。使用角度跨过域名发布表单数据

我已经创建了一个小应用程序。我已经从home.html页面发布数据到getdata.html页面，并且在getdata.html页面上我必须收到该数据。我必须只使用表格发布数据。我有使用POST请求来传递报头数据，然后我不得不接受它

test.js

var mainApp = angular.module("mainApp", ['ngRoute']); 

mainApp.config(function($routeProvider) { 
$routeProvider 
    .when('/home', { 
     templateUrl: 'home.html', 
     controller: 'StudentController' 
    }).when('/getdata', { 
     templateUrl: 'getdata.html', 
     controller: 'getdataController' 
    }) 
    .otherwise({ 
     redirectTo: '/home' 
    }); 
}); 

mainApp.controller('StudentController', function($scope,$location,$window) { 
$scope.user = {firstName:"John", lastName:"Doe"}; 
}); 
mainApp.controller('getdataController', 
function($scope,$location,$window,$routeParams) { 
alert("Get Data"); 
});

getdata.html

<div ng-controller='getdataController'> 
<h2>Get Data</h2> 
</div>

home.html做为

<div class="container" ng-controller='StudentController'> 
<h1>Post Form Data</h1> 
<form novalidate method="post" action='http://localhost/#/getdata'> 
<input type='hidden' value='Mohan' name="hiddenfld1"/> 
<input type='hidden' value='Sharma' name="hiddenfld2"/> 
<input type='hidden' value='ABC.com' name="hiddenfld3"/> 
First Name:<br> 
<input type="text" name='fname' ng-model="user.firstName"><br> 
Last Name:<br> 
<input type="text" name='lname' ng-model="user.lastName"> 
<br><br> 
<input type="submit" value="Submit"> 
</form> 
</div>

index.html

<!DOCTYPE html> 
<html> 
<head lang="en"> 
    <meta charset="utf-8"> 
</head> 
<body> 

    <div ng-app="mainApp"> 
    <ng-view></ng-view> 
    </div> 

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.28/angular.min.js"></script> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.28//angular-route.min.js"></script> 
    <script type="text/javascript" src="test.js"></script> 
</body>

来源

2017-06-12 Anshul Johri

问题是什么？ –

当我发布表单使用表单提交（ng-submit）然后另一个页面不加载405错误来了，我不知道如何接收这些数据 –

我不认为你需要'发布'数据，你只需要将其传递给该控制器/视图。您应该使用工厂保存数据并致电工厂检索它。 – alphapilgrim

app.controller('example-ctrl',$scope,$http){ 

$scope.saveFormData = function(argument_list){ 
    $http.post('url',data,header).then(function(response){ 
    // success response 
    },function(error){ 
    // error 
    }); 
} 
}

我认为这link可以帮助你

来源

2017-06-12 16:03:58

我必须在HTML页面上发布数据而不是数据库或任何服务 –

试试这个。首先，您需要在HTML表单中进行一些更改。删除方法并使用ng-submit。接下来，您需要注册一个工厂以保存并从中检索数据。请注意，如果窗口/状态被刷新，数据将不会持续。你需要探索其他方法，如果这是你想要的（对于另一个问题）。然后在主控制器中添加一个作用域函数来添加保存用户，并在重定向到该调用的成功之后。

mainApp.controller('StudentController', function($scope, $location, $window, exampleFactory) { 
    $scope.user = { 
    firstName: "John", 
    lastName: "Doe" 
    }; 

    $scope.submitUser = function() { 
    exampleFactory.saveUser(user) 
     .then(function() { 
     $location.path('getdata'); 
     }); 
    }; 
}); 
mainApp.controller('getdataController', 
    function($scope, $location, $window, $routeParams, exampleFactory) { 
    exampleFactory.getUserDetails() 
     .then(function(user) { 
     $scope.user = user; 
     }); 
    }); 
mainApp.factory('exampleFactory', [function() { 

    var currentUser; 
    return { 
    saveUser: function(userDetails) { 
     currentUser = userDetails; 
    }, 
    getUserDetails: function() { 
     return currentUser; 
    } 
    }; 
}]);

<div class="container" ng-controller='StudentController'> 
    <h1>Post Form Data</h1> // do not use method type on angular forms, add no validate, and use the routers native way to redirect. 
    <form novalidate ng-submit="submitUser()"> 
    <input type='hidden' value='Mohan' name="hiddenfld1" /> 
    <input type='hidden' value='Sharma' name="hiddenfld2" /> 
    <input type='hidden' value='ABC.com' name="hiddenfld3" /> First Name:<br> 
    <input type="text" name='fname' ng-model="user.firstName"><br> Last Name:<br> 
    <input type="text" name='lname' ng-model="user.lastName"> 
    <br><br> 
    <input type="submit" value="Submit"> 
    </form> 
</div>

来源

2017-06-12 16:34:39 alphapilgrim

它将主要数据，如果我接收数据在同一个域中，但对于我认为不同的域工厂将丢失数据。如果我必须从一个域传递一些数据并将其接收到其他域，那么该选项是什么。例如：我有我从abc.com/home.html发布数据，我必须将其接收到xyz.com/about.html，其中home.html和about.html是不同不同域（网站）上的页面。 –

@AnshulJohri你需要一些保存数据的方式，比如数据库。那么你可以定义一个端点从两个站点中检索。 – alphapilgrim

不是数据库是其他任何最好的方法。在asp.net中有一个概念，用于在.aspx页面上发布数据，并从数据页面获取数据我可以在角度上做同样的工作 –

使用角度跨过域名发布表单数据

回答

相关问题