Angular UI-router基于用户id的新状态

时间:2015-12-19 15:53:59

标签: angularjs angular-ui-router

我使用angular-ui-router构建一个单页应用程序。 在我的" cerca"状态我有一个表显示我的数据库中的所有用户。 任何行的最后一列包含指向第i个用户的链接。 我希望能够单击此链接并显示一个用户页面,其中包含有关特定用户的所有信息(可能使用用户ID从db中检索)。 在我的" cerca"状态我有所有用户的ID。我试图使用它们来构建动态URL,但我很难将id传递给新状态。这是我的app.config:

app.config(function($stateProvider, $urlRouterProvider){
$urlRouterProvider.otherwise('/home');
 $stateProvider
.state('home',{
    url:'/home',
    templateUrl: 'pages/home.html',
    controller: 'homeCtrl'
   })
 .state('inserisciP',{
    url:'/inserisciP',
    templateUrl: 'pages/inserisciPaziente.html',
    controller: 'inserisciController'
  })
  .state('cerca',{
    url:'/cerca',
    templateUrl:'pages/cercaPaziente.html',
    controller: 'cercaController'
  })
  .state('paziente',{
    url:'/paziente',
    templateUrl:'pages/paziente.html',
    controller: 'pazienteController'
  })
  .state('inserisciE',{
    url:'/inserisciE',
    templateUrl:'pages/inserisciEsame.html'
  })
 .state('listaLavoro',{
    url:'/listaLavoro',
    templateUrl:'pages/listaLavoro.html',
  })
 .state('refertazione',{
    url:'/refertazione',
    templateUrl:'pages/refertazione.html'
   })
.state('nomeUtente',{
    url:'/nomeUtente',
    templateUrl:'pages/nomeUtente.html'
})
.state('amministrazione',{
    url:'/amministrazione',
    templateUrl:'pages/amministrazione.html'
})
.state('richiestaRadiologia',{
    url:'/richiestaRadiologia',
    templateUrl:'pages/richiestaRadiologia.html'
})
.state('help',{
    url:'/help',
    templateUrl:'pages/help.html'
});

 });

这是我的表:

<tr ng-repeat="p in copiaTable">
  <td>{{p.id}}</td>
  <td>{{p.last_name}}</td>
  <td>{{p.first_name}}</td>
  <td>{{p.codice_fiscale}}</td>
  <td>{{p.phone_number}}</td>
  <td><a ui-sref="paziente">edit</a></td>
</tr>

我还尝试创建一个服务来在各州之间共享数据...... 关于如何用ui-router解决这个问题的任何建议?

1 个答案:

答案 0 :(得分:3)

单击链接时,可以将参数传递给某个状态。假设您要传递用户ID。链接的代码如下:

<a ui-sref="paziente({userID: p.id})">edit</a>

在您的路线配置文件中,您可以像这样定义paziente状态:

state('paziente',{
  url:'/paziente/:userID',
  templateUrl:'pages/paziente.html',
  controller: 'pazienteController'
})

使用传递的ID,您可以在工厂中找到用户。