Javascript 角度双向数据绑定_Javascript_Angularjs_Angularjs Directive_Javascript Databinding

Javascript 角度双向数据绑定

javascript angularjs

Javascript 角度双向数据绑定,javascript,angularjs,angularjs-directive,javascript-databinding,Javascript,Angularjs,Angularjs Directive,Javascript Databinding,为可能是一个非常基本的问题道歉。我正在用angular做一个小的演示测试项目。在第一页上，我有一个基本的双向数据绑定问候语（即在框中输入您的姓名，它欢迎用户，例如Welcome{{name}} 我如何保存输入的名称并将此欢迎信息传递到下一页/模板？以下是代码 <strong>Welcome</strong> {{email}} <p class="lead">Please enter your name </p> <body

为可能是一个非常基本的问题道歉。我正在用angular做一个小的演示测试项目。在第一页上，我有一个基本的双向数据绑定问候语（即在框中输入您的姓名，它欢迎用户，例如

Welcome{{name}}

我如何保存输入的名称并将此欢迎信息传递到下一页/模板？以下是代码

<strong>Welcome</strong> {{email}}

  <p class="lead">Please enter your name </p>
      <body ng-app ng-init="email = 'John';">
      <label>enter name<input type="text" ng-model="firstName"/></label><br />
  </body>

我从一个yeoman angular scaffold开始，所以只更改了很少的代码。提前感谢您的angular Wizard类向导

要轻松实现您的愿望，您可以创建一个保留用户名的服务：

angular.module('angularQuizApp').
 factory('StorageService',[
function(){

    var name = "";

    var _setName  = function(name){
        name = name;
    }:

    var _getName = function(){
        return name;
    };  

    return {
        setName : _setName,
        getName : _getName,
    }



}]);

然后在控制器中，从服务调用正确的方法：

angular.module('angularQuizApp').
controller('MyController', ['$scope', 'StorageService',
   function($scope, StorageService) {
     $scope.name = StorageService.getName(); // or setName(name_value)
}]);

通过这种方式，这项服务通过你的angular应用程序保留用户名。在这项服务中，你可以保存你想要的任何东西。但如果您退出应用程序，此对象/名称将被销毁

如果要持久保存对象，请查看角度存储：

编辑

下面是我制作的一个功能性应用程序：

我们不知道您如何处理路由…我们无法为您提供如此少的信息。抱歉，我将编辑：）在使用NGCookie时，请参见此处：@Mobeale，我问这个问题是因为一些开发人员在服务器内部处理路由。在这种情况下，使用服务将不起作用（但cookies很好），您也可以将这种重要的值存储到$rootScope中。不幸的是，无法实现这一点，Dude:（双向绑定工作正常，但它没有将值保存到下一页Marius，非常感谢Dude！Plnkr已经使它变得漂亮和清晰

angular.module('angularQuizApp').
controller('MyController', ['$scope', 'StorageService',
   function($scope, StorageService) {
     $scope.name = StorageService.getName(); // or setName(name_value)
}]);