Как хранить данные с двух разных веб-страниц в одном контроллере в angular.js

Я пытаюсь создать веб-страницу, которая позволяет создать некоторую задачу на сервере с помощью Angular.js. Если вы хотите создать задачу, вам нужны API, потому что из этого я не хочу вводить API для каждой создаваемой задачи. Я хочу вводить API только один раз, но я не хочу делать это с локальным или сессионным хранилищем.Как хранить данные с двух разных веб-страниц в одном контроллере в angular.js

и сохранить в объекте json, который я создаю, но когда я ввожу данные на один и тот же объект из разных форм, он не получает данные в одном объекте. Я могу взять данные из объекта, но не в одной части

<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> 
 

 
\t <div class="form-group"> 
 
\t <input class="form-control" type="text" placeholder="Task Name" ng-model="formData.task_name" id="task_name" required> 
 
\t </div> 
 
\t 
 
\t <div class="form-group"> 
 
\t <input class="form-control" type="text" placeholder="E-Mail" ng-model="formData.email" id="email" required> 
 
\t </div> 
 

 
\t <div class="form-group"> 
 
\t <input class="form-control" type="text" placeholder="Currency" ng-model="formData.currency" id="currency" required> 
 
\t </div> 
 
\t 
 
\t <div class="form-group"> 
 
\t <label for="frequency">Above</label> 
 
\t <input class="minimal" name="compare" ng-model="formData.compare" type="radio" checked id="above" value="above"> 
 
\t <label for="frequency">Below</label> 
 
\t <input class="minimal" name="compare" type="radio" ng-model="formData.compare" id="below" value="below"> 
 
\t <input type="number" step="any" name="threshold" ng-model="formData.threshold" id="threshold" placeholder="e.g. 0.9" required> 
 
\t </div> 
 
\t 
 
\t <div class="form-group"> 
 
\t <button type="submit" class="btn btn-success">Submit</button> 
 
\t </div> 
 

 
</form> 
 
{{formData}} 
 
{{formData.apiKey}} 
 

 

 
</div> 
 
    </div>

Вот мой HTML код валюты оповещения.

<!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> 
 
\t <body ng-controller="generalController"> 
 

 
     <!-- HEADER AND NAVBAR --> 
 
     <header> \t 
 
      <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"> 
 
\t \t <div class="jumbotron text-center"> 
 
     <h1> 
 
\t \t API KEYS 
 
\t \t </h1> 
 
\t \t <div class="form-group"> 
 
\t \t <input type="text" id="api_key" placeholder="API Key" ng-model="formData.apiKey" class="form-control"></input> 
 
\t \t </div> 
 
\t \t <div class="form-group"> 
 
\t \t <input type="text" id="api_secret" placeholder="API Secret" ng-model="formData.apiSecret" class="form-control"></input> 
 
\t \t {{formData}} 
 
\t \t </div> 
 
\t \t \t </div> 
 
\t \t \t <div ng-view> 
 
\t \t \t 
 
\t \t \t </div> 
 

 

 
     </div> 
 

 
    </body> 
 
    </html>

и это один для главной страницы.

И, наконец, мой .js-файл.

// app.js 
 
var myApp = angular.module('myApp', ['ngRoute']); 
 

 
myApp.config(function($routeProvider){ 
 
\t 
 
\t $routeProvider 
 
\t \t \t \t \t \t 
 
\t \t \t 
 
\t \t \t .when('/', { 
 
\t \t \t \t templateUrl : 'pages/home.html', 
 
\t \t \t \t controller : 'generalController' 
 
\t \t \t }) 
 

 
\t \t \t 
 
\t \t \t .when('/about', { 
 
\t \t \t \t templateUrl : 'pages/about.html', 
 
\t \t \t \t controller : 'generalController' 
 
\t \t \t }) 
 

 
\t \t \t 
 
\t \t \t .when('/contact', { 
 
\t \t \t \t templateUrl : 'pages/contact.html', 
 
\t \t \t \t controller : 'generalController' 
 
\t \t \t }); 
 
\t 
 
}); 
 

 

 

 
myApp.controller('generalController', function($scope){ 
 
\t $scope.message = 'you are at general page'; 
 
\t 
 
\t $scope.formData={ 
 
\t \t apiKey:"", 
 
\t \t apiSecret:"", 
 
\t \t currency:"", 
 
\t \t task_name:"", 
 
\t \t compare:"", 
 
\t \t email:"", 
 
\t \t threshold:"" 
 
\t }; 
 
});

источник

2015-08-15 Suat Karabacak

Вам необходимо сохранить общие данные на заводе или на сервисе. Каждый раз, когда вы переключаете страницу, контроллер загружается свеже и, следовательно, без данных из формы –

может быть $ rootScope, https://docs.angularjs.org/api/ng/service/$rootScope – jyrkim

вы можете использовать сервис для обмена данными между контроллерами. ниже приведен пример того, как это сделать.

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; 
});

источник

2015-08-15 10:46:30 harishr

, что очень помогает. Благодаря ! –

Как хранить данные с двух разных веб-страниц в одном контроллере в angular.js

ответ

Смежные вопросы