angle ui-srefの使い方

Question

「健康でない」注文を編集するためのリンク付き注文データテーブルがあります。

ui-srefを使用して編集ページにリンクし、特定の注文IDを渡す方法がわかりません。 （？Iは、ルーティングされたアプリのhrefが浮気されて使用すると、それはない右、UI-SREFを使用するようになってる？）

これは私が取得エラーです：

は「＃/ editlistingを解決できませんでした。/layout.orders 『

状態から』 3' は、ここに私のコントローラのコードの抜粋です：

OrderService.getOrders().then (
    function success(response) { 
    vm.Orders = response; 
     angular.forEach(vm.Orders, function (order, k) { 
     if (!order.listing.Completed) { 
      order.Health.push({ 
      message: "Missing listing info.", 
      link: "/editlisting/" + order.listing.Id 
      }); 
     }; 
    )}; 
    } 
}); 

私は今心配ですすべてが

ですHTMLの

link: "/editlisting/" + order.listing.Id 

スニペット：私はどこかVARまたはREFを誤って入力した場合、あまり心配しないでください（

 $stateProvider 
      .state('layout.editlisting', { 
       url: '/editlisting/:id', 
       templateUrl: 'Content/js/apps/store/views/edit_listing.html', 
       controller: 'editListingController', 
       controllerAs: 'listingVm', 
       data: { pageTitle: 'Edit Listing' } 
      }) 

：

<tr ng-repeat="health in order.Health"> 
    <td> 
    <div ng-repeat="health in order.Health"> 
     <a ui-sref="{{health.link}}">{{health.message}}</a> 
    </div> 
    </td> 
</tr> 

私のルートは、このようになりますそれについて。私の問題は、そう）実際のリンクで

ある一言で言えば、この：

<a ui-sref="{{health.link}}">{{health.message}}</a> 

は私にこれを与える：

は」状態から '＃/ editlisting/3' を解決できませんでした。 layout.orders'このものの

が正常に動作します：

<a href="{{health.link}}">{{health.message}}</a> 

しかし、それはルータを完全にバイパスしているのですか？

Answer 1

URLの代わりに状態を使用し、次のようにIDを渡すことができます。私はあなたのような例として、 '3' を使用しています：ここで

<a ui-sref="layout.editlisting({id:3})">{{health.message}}</a> 

は、私はあなたがeditlistingにクリックした場合、あなたのlayout.editlistingのUI-SREFを...追加する微調整previous plunkerです：

<a ui-sref="layout.editlisting({id:3})">editlisting</a> 

それは私が作成したダミーテンプレート...ただのテキストが表示されます：コントローラで

.state('layout', { 
     url: '/layout', 
     template: '<div ui-view/>', 
     abstract: true 
     }) 
    .state('layout.editlisting', { 
    url: '/editlisting/:id', 
    template: '<h1>edit listing id = {{ vm.id }}</h1>', 
    data: { 
     pageTitle: 'Edit Listing' 
    }, 
    controller: function($stateParams) { 
     var vm = this; 
     console.log('Edit listing controller' + $stateParams.id); 
     vm.id = $stateParams.id; 
    }, 
    controllerAs: 'vm' 
    }) 

を、私は$ stateParams.id（URLで渡さすなわち1）を使用してIDを取得し、私はそれを表示します