angularjs - 我如何將列表傳遞給其他html？

這是index.html的angularjs - 我如何將列表傳遞給其他html？

<!DOCTYPE html> 
<html lang="en" ng-app="myApp"> 
<head> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
     <title>index</title> 
     <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
     <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"></script> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
     <link rel="icon" href="data:;base64,="> 
     <style> 
     </style> 

</head> 

<body> 
     <ul class="papa"> 

       <li><a href="/1_input">input</a></li> 
       <li><a href="/2_output">output</a></li> 
     </ul> 

     <ng-view></ng-view> 

     <script> 

       var app1 = angular.module('myApp', ['ngRoute']); 
       app1.config(['$routeProvider', '$locationProvider',function($routeProvider, $locationProvider) { 
         $routeProvider 
         .when('/1_input', { 
          controller: 'input_control', 
          templateUrl: '/1_input.html' 
        }) 
         .when('/2_output/:firstnamehh/:lastnamehh', { 
          controller: 'output_control', 
          templateUrl: '/2_output.html' 
         }) 
         .otherwise({redirectTo:'/1_input'}); 

         $locationProvider.html5Mode({ enabled: true, requireBase: false }); 
       }]); 

       app1.controller('input_control',function($scope, $location){ 
         //$scope.init_table = {name1:"", name2:""}; 
         //$scope.score_card = []; 
         // 
         $scope.loadView2 = function(){ 
           // $scope.score_card.push({ 
           //   name1: $scope.firstnamehh, 
           //   name2: $scope.lastnamehh 
           // }) 
           // console.log($scope.score_card); 
       $location.path('/2_output/'+$scope.firstnamehh+'/'+$scope.lastnamehh); 
         //$location.path('/2_output/'+$scope.firstnamehh+'/'+$scope.lastnamehh); 
         //$location.path('/2_output/'+$scope.score_card; 
         //$location.path('/2_output/'+$scope.firstnamehh+$scope.lastnamehh+$scope.score_card); 
         //$location.path('/2_output/'+$scope.score_card); 
      } 
       }); 

       app1.controller('output_control',function($scope, $routeParams){ 
         $scope.name1=$routeParams.firstnamehh; 
         $scope.name2=$routeParams.lastnamehh; 
         //$scope.name2=$routeParams.({?name1=$scope.firstnamehh}); 
         //$scope.out_score=$routeParams.score_card; 
         //$scope.name3 = $routeParams[score_card]; 
       }); 

     </script> 
</body> 
</html>

這是1_input.html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
     <title>1_input</title> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

</head> 
<body> 
     First name: <input type="text" ng-model="firstnamehh"/> <br/> 
     Last name: <input type="text" ng-model="lastnamehh"/> <br/> 
     <button ng-click="loadView2()">to output page</button> 
</body> 
</html>

這是2_output.html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
    <title>2_output</title> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

</head> 
<body> 
    From View2. 
    <ul> 
     <li>{{name1}}</li> 
     <li>{{name2}}</li> 
     <!-- <tr ng-repeat="aa in score_card"> 
      <td>{{aa.name1}}</td> 
      <td>{{aa.name2}}</td> 
     </tr> --> 
    </ul> 
</body> 
</html>

你好，大家好，我是新來angularjs並尋找一些幫助！我正在嘗試的是，將firstnamehh和lastnamehh作爲列表，並將其傳遞給2_output.html，並最終將其打印在表格中。我掙扎的部分是我應該放在$ routeParams和$ location.path（）後面。

$routeParams.???

$location.path('/2_output/'+$scope.???);

任何意見，將不勝感激！

DataService.set(shredData);

在你output_control得到的數據：感謝您閱讀這個問題

來源

2016-11-19 J. long

您可以通過使用服務

app.factory('DataService', function() { 
    var appData = {} 

    function set(data) { 
     appData = data; 
    } 

    function get() { 
     return appData; 
    } 

    return { 
     set: set, 
     get: get 
    } 

}

在你input_control可以將數據設置爲服務實現這一目標服務：

$scope.appdata = DataService.get();

通過pa在控制器中注入DataService將其作爲參數來使用

app.controller('input_control', ['DataService', function($scope, $location, DataService){ 
     //Your logic 
}]);

來源

2016-11-19 08:29:03 sreeramu

謝謝！雖然我仍然在努力做我想做的事情，但你的回答給了我很多線索，我該怎麼做！ –

angularjs - 我如何將列表傳遞給其他html？

回答

相關問題