Question

我正在尝试创建一个网页，允许您使用Angular.js在服务器上创建一些任务当您想要创建任务时，您需要API，因为我不想为每个任务输入API我创建我想只输入一次API，但我不想用本地存储或会话存储

并保留在我创建的json对象中，但是当我从不同的表单向同一个对象输入数据时，它不会在同一个对象中获取数据。我可以从对象中获取数据，但不是单件中的数据

＆＃13;

 <div class="jumbotron text-center">
        <h1>Currency Alert Form</h1>
                    This form makes use platform to send you email notifications when a currency exchange rate falls or rises above a value.<br><br>
<div>

<form role="form" ng-submit="" novalidate>

	<div class="form-group">
	<input class="form-control" type="text" placeholder="Task Name" ng-model="formData.task_name" id="task_name" required>
	</div>
	
	<div class="form-group">
	<input class="form-control" type="text" placeholder="E-Mail" ng-model="formData.email" id="email" required>
	</div>

	<div class="form-group">
	<input class="form-control" type="text" placeholder="Currency" ng-model="formData.currency" id="currency" required>
	</div>
	
	<div class="form-group">
	<label for="frequency">Above</label>
	<input class="minimal" name="compare" ng-model="formData.compare" type="radio" checked  id="above" value="above">
	<label for="frequency">Below</label>
	<input class="minimal" name="compare" type="radio" ng-model="formData.compare"  id="below" value="below">
	<input type="number" step="any" name="threshold" ng-model="formData.threshold" id="threshold" placeholder="e.g. 0.9" required>
	</div>
	
	<div class="form-group">
	<button type="submit" class="btn btn-success">Submit</button>
	</div>

</form>
{{formData}}
{{formData.apiKey}}


</div>
    </div>

＆＃13;

以下是我的货币提示HTML代码。

＆＃13;

 <!DOCTYPE html>
     <html ng-app="myApp">
    <head>
      
      <!-- load bootstrap and fontawesome via CDN -->
      <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
      <link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.0/css/font-awesome.css" />

      
      <!-- load angular and angular route via CDN -->
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script>
      <script src="js/app.js"></script>
    </head> 
	<body ng-controller="generalController">   

        <!-- HEADER AND NAVBAR -->
        <header>	
            <nav class="navbar navbar-default">
            <div class="container">
                <div class="navbar-header">
                    <a class="navbar-brand" href="/">waylay task center</a>
                </div>

                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#"><i class="fa fa-home"></i> Home</a></li>
                    <li><a href="#about"><i class="fa fa-shield"></i> APIs</a></li>
                    <li><a href="#contact"><i class="fa fa-comment"></i> Currency Alert</a></li>
                </ul>
            </div>
            </nav>
        </header>

        <!-- MAIN CONTENT AND INJECTED VIEWS -->
        <div id="main">
		 <div class="jumbotron text-center">
        <h1>
		 API KEYS
		 </h1>
		<div class="form-group">
		<input type="text" id="api_key" placeholder="API Key" ng-model="formData.apiKey" class="form-control"></input>
		</div>
		<div class="form-group">
		<input type="text" id="api_secret" placeholder="API Secret" ng-model="formData.apiSecret" class="form-control"></input>
		{{formData}}
		</div>
			</div>
			 <div ng-view>
			
			 </div>


        </div>

    </body>
    </html>

＆＃13;

这个是主页。

最后是我的.js文件。

＆＃13;

// app.js
var myApp = angular.module('myApp', ['ngRoute']);

myApp.config(function($routeProvider){
	
	$routeProvider
						
			
			.when('/', {
				templateUrl : 'pages/home.html',
				controller  : 'generalController'
			})

			
			.when('/about', {
				templateUrl : 'pages/about.html',
				controller  : 'generalController'
			})

			
			.when('/contact', {
				templateUrl : 'pages/contact.html',
				controller  : 'generalController'
			});
	
});



myApp.controller('generalController', function($scope){
	$scope.message = 'you are at general page';
	
	$scope.formData={
		apiKey:"",
		apiSecret:"",
		currency:"",
		task_name:"",
		compare:"",
		email:"",
		threshold:""
	};
});

＆＃13;

Answer 1

您可以使用服务在控制器之间共享数据。下面是一个如何做的例子

app.factory('theService', function() {  
    return {
        customers: {}
    };
});

app.controller("DashboardCtrl", function($scope, theService) {
    theService.customers = $scope.customers;
});

app.controller("ClientCtrl", function($scope, theService) { 
    $scope.customers = theService.customers; 
});

如何在angular.js中将来自两个不同网页的数据存储在一个控制器中

1 个答案: