2016-02-26 30 views
1

我正在爲Rest服務開發CRUD界面。目前,我可以設法獲得系統中的團隊名單。從函數調用控制器並將其傳遞給URL編碼參數

我喜歡做的是顯示單擊顯示鏈接時的詳細信息。目前點擊鏈接調用一個函數(尚未實現),該函數應該將細節部分加載到ng-view中。該函數應該將參數傳遞給ViewTeamController,該參數隨後將調用Rest服務並將結果賦予$scope變量。

我不確定如何調用ViewTeamController可能使用showTeam()函數的URL編碼參數。我還想知道如何讀取ViewTeamController中的URL編碼參數。

在此先感謝。

<!doctype html> 
<html> 

<head> 
    <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script> 
    <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular-route.min.js"></script> 

    <script> 
     var teamApp = angular.module("teamApp", ['ngRoute']); 

     teamApp.controller('teamController', function($scope, $http) { 

      $http 
        .get('/teams') 
        .success(function(response) { 
         $scope.teams = response; 
        } 
        ); 
     }); 

     mainApp.config(['$routeProvider', function($routeProvider) { 
      $routeProvider. 

      when('/addTeam', { 
       templateUrl: 'addTeam.htm', 
       controller: 'AddTeamController' 
      }). 

      when('/viewTeam', { 
       templateUrl: 'viewTeam.htm', 
       controller: 'ViewTeamController' 
      }). 

      otherwise({ 
       redirectTo: '/addTeam' 
      }); 
     }]); 

     mainApp.controller('AddTeamController', function($scope) { 

     }); 

     mainApp.controller('ViewTeamController', function($scope) { 

     }); 

    </script> 
</head> 

<body> 

<div ng-app = "teamApp" ng-controller="teamController"> 

    <a ng-click="newTeam()">new</a> 

    <div ng-repeat="team in teams" > 
     Name: {{team.name}} 
     <br /> 
     Description: {{team.description}} 
     <br /> 
     <a ng-click="showTeam(team.id)">show</a> 
    </div> 

    <div ng-view></div> 

    <script type = "text/ng-template" id = "addTeam.htm"> 
     <h2> Add Team </h2> 
     To be implemented later. 
    </script> 

    <script type = "text/ng-template" id = "viewTeam.htm"> 
     Name: {{team.name}} 
     Description: {{team.description}} 
    </script> 
</div> 
</body> 
</html> 

回答

1

你的控制器功能可以得到通過AngularJS訪問路由參數$routeParams服務是這樣的:

mainApp.controller('ViewTeamController', function($scope, $routeParams) { 
       $scope.param = $routeParams.param; // will hold your encoded params 
     }); 

考慮您傳遞的參數爲您的網址是這樣的,

/viewTeam/23535t4645645g4t4 

現在您的$scope.param將會保留23535t4645645g4t4

相關問題