一个控制器两个视图

时间:2016-12-27 02:43:06

标签: angularjs ionic-framework

我有一个视图,用户提供输入并在另一个视图中显示它。

查看1:

<ion-content ng-controller="controller">
<input type="text" ng-model="name">
<button ng-click="save()">Save</button>

控制器:

   $scope.save = function () {
    $scope.displayName = $scope.name;
    $state.go('app.viewTwo');
}

观看2:

<ion-content ng-controller="controller">
{{displayName}}
</ion-content>

众所周知,无论何时加载视图,控制器每次都会初始化。那么如何在另一个视图中显示第一个视图中的值。

1 个答案:

答案 0 :(得分:0)

您需要使用servicefactory来跨控制器使用变量。

<强>样本:

&#13;
&#13;
 var app = angular.module("clientApp", [])
 app.controller("TestCtrl", 
   function($scope,names) {
     $scope.names =[];
    $scope.save= function(){
      names.add($scope.name);
    }
   
   $scope.getnames = function(){
     $scope.names = names.get();
   }
   }
  );
   
app.factory('names', function(){
  var names = {};

  names.list = [];

  names.add = function(message){
    names.list.push({message});
  };
  
  names.get = function(){
    return names.list;
  };

  return names;
});
&#13;
<!doctype html>
<html >

<head>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
  <script src="script.js"></script>
</head>

<body ng-app="clientApp">
  <div ng-controller="TestCtrl">
    <input type="text" ng-model="name">
    <button ng-click="save()" > save</button>
    
  </div>
  
  <div ng-init="getnames()" ng-controller="TestCtrl">
     <div  ng-repeat="name in names">
       {{name}}
       </div>
     
  </div>
</body>

</html>
&#13;
&#13;
&#13;

您也可以使用$ rootScope,但这不是推荐方式。