パラメータui-routerを子に注入する

Question

子供のビューをウェブに注入したい。

var states = [ 
    { 
     name: 'application', 
     url: '/application', 
     component: 'application' 
    }, 
    { 
     name: 'application.detail', 
     url: '/:id', 
     component: 'applicationInfo' 
    } 
]; 

// Loop over the state definitions and register them 
states.forEach(function(state) { 
    $stateProvider.state(state); 
}); 

私はボタンがあり、しようとします：

私は自分の設定を宣言していますか？ビューを注入する

 <button type="button" ui-sref="application.detail({id: application.id})" class="btn btn-sm btn-danger"> 
      <i class="glyphicon glyphicon-info-sign"> 
      </i> 
     </button> 

およびコンポーネント：

angular.module('crudModule').component('applicationInfo', { 
template: '<h1>hellllooooooooo</h1>', 
controller: function($stateParams) { 
    } 
}); 

EDITED：

アプリケーションコンポーネント：

angular.module('crudModule').component('application', { 
templateUrl: 'applicationModule.html', 

controller: function($http, $scope, httpService, $cookies, $log, $document, $dialogs) { 
    httpService.httpGetRequest('http://localhost:8080/applications').then(function success(response) { 
     $scope.applications = response.data; 
     $scope.displayedApplications = [].concat($scope.applications); 
    }) 

    $scope.deleteApplication = function (id) { 
     $http({ 
      method: 'DELETE', 
      url: "http://localhost:8080/application/" + id, 
     }).then(function success(response) { 
       httpService.httpGetRequest('http://localhost:8080/applications').then(function success(response) { 
       $scope.applications = response.data; 
       $scope.displayedApplications = [].concat($scope.applications); 
      })}) 
    }; 
} 

}）。私は/アプリケーション/（数）にボタンの上に私のURLの変更をクリックすると が、ビューは変更されません：

applicationModuleのHTMLは：

<table st-table="applications" st-safe-src="displayedApplications" class="table table-striped" style="width: auto;"> 
    <thead> 
    <tr> 
     <th st-sort='id'>Id</th> 
     <th st-sort='name'>Name</th> 
    </thead> 
    <tbody> 
    <tr ng-repeat="application in applications"> 
     <td>{{application.id}}</td> 
     <td>{{application.name}}</td> 
     <td>More info 
      <button type="button" ui-sref="application.detail({id: application.id})" class="btn btn-sm btn-danger"> 
       <i class="glyphicon glyphicon-info-sign"> 
       </i> 
      </button> 
     </td> 
    </tr> 
    </tbody> 
</table> 
<div class="form-group"> 
    <button class="btn btn-primary" ui-sref="addApplication">Add new</button> 
</div> 
<div class="form-group"> 
    <button type="button" class="btn btn-default" ng-click="open()">Open me!</button> 
</div> 

私は、アプリケーション・モジュールが含まれています。

Answer 1

あなたはあなたのアプリケーションコンポーネントを持っている必要があります：ルーター検索このコンテンツを入れているので

<ui-view></ui-view> 

。

チェックこのためoficialドキュメントは： https://ui-router.github.io/ng1/tutorial/hellogalaxy