Question

我要做的是为请求中的每个请求创建一个ui-view。当app state = request.detail时，我想呈现＆＃34;详细信息＆＃34;进入UI视图，将id设置为request.id。我无法弄清楚如何通过angular传递request.id并命名状态动态呈现的ui-view。

例如，如果request.id = 1，我希望ui-view为ui-view =＆＃34; 1＆＃34 ;; 如果request.id = 23，我希望ui-view =＆＃34; 23＆＃34;。

Request.js

app.config(function($stateProvider, $urlRouterProvider, $locationProvider) {
 $stateProvider
    .state('home', { url: '',  views: { 'main': { templateUrl: 'static_pages/home.html'}}})
    .state('requests', { url: '/requests',  views: {'main': { templateUrl: 'requests.html', controller: 'RequestsCtrl'}}})
    .state('requests.detail',  { url: '/:id', views: {':id': { templateUrl: function($stateParams) {return `/requests/${$stateParams.id}`;}, controller: 'RequestController'}}})
    .state('requests.detail.pdf', { url: '.pdf', views: { 'requestpdf': {  templateUrl: function($stateParams) {return `/requests/${$stateParams.id}.pdf`;}, controller: 'RequestController'}}})
    .state('requests.detail.edit',  { url: '/edit', views: {'main2': { templateUrl: function($stateParams) {return `/requests/${$stateParams.id}/edit`;}, controller: 'RequestController'}}})
    .state('users', { url: '/users', templateUrl: 'users.html', controller: 'UsersCtrl'})
    .state('/users/:id', { url: 'users_show.html', controller: 'UsersCtrl' });

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

});

app.controller("RequestsCtrl", ['$scope', '$state', '$stateParams', 'Request', '$location',  function($scope, $stateParams, $state, Request, $location ) {


    $scope.requests = Request.query();
    $scope.request = Request.query();

    $scope.deleteRequest = function (request) {
        Request.delete({id: request.id})
        console.log("deleted" + request.id);
    }


}]);

app.controller("RequestController", ['Request', '$scope', '$stateParams', RequestController]);

function RequestController( $scope, $stateParams, Request ) {
        $scope.currentRequestId = $stateParams.request.id;
};

的index.html

  <div id='requests' class="requests col-xs-5 col-md-5" ng-controller="RequestsCtrl" >

  <div ng-repeat="request in requests" class="request">
     <div id="full" ui-view="{{request.id}}"></div>
      <a ng-click="showRequest(request);">
      <span ng-if="request.read == false"> *NEW*</span>
      <span class="col-xs-12">Request #{{request.id}}</span><br>
      <span class="col-xs-1">{{request.name}}</span>
      <span class="col-xs-1">{{request.email}}</span>
      <span class="col-xs-4 col-xs-offset-4">{{request.city}}, {{request.state}}, {{request.region}} </span>
    </a>
    <div>
      <div ng-controller="RequestController">
        <a ui-sref="requests.detail({id: request.id})" ng-click="showfullreqest()" ng-init="fullrequest = false">View</a>
        <a ng-click="deleteRequest(request)" style="float:left;"> Delete </a>
      </div>
    </div>
  </div>
</div>

AngularJS没有将ID传递给UI-View

0 个答案: