AngularJSアプリケーションが適切なwebapiメソッドを呼び出さず、正しいhtmlページを表示しない

Question

こんにちは、私は基本的にWebAPI呼び出しを行っているAngularJSアプリケーションを作成しています。私は、WebApi Callの助けを借りてすべての製品を一覧表示する画面を作成しました。ハイパーリンクの列を作成しました。クリックすると詳細ページが表示されます。ハイパーリンクをクリックするたびに、元のWebAPIのGetメソッドが呼び出され、詳細ページに対して理想的に呼び出されるべきではありません。私は問題が何であるか分かりません。私のルーティングは大丈夫です。私のすべてのルート状態は正しく定義されています。下はコードです。

app.jsのコードこれは私のルート状態が定義されているファイルです。

.state("productList", { 
          url: "/products", 
          templateUrl: "/products/productListView.html", 
          controller: "ProductListCtrl as vm" 
         }) 

.state("productDetail", { 
          url: "/products/:Id", 
          templateUrl: "/products/productDetailView.html", 
          controller: "ProductDetailCtrl as vm", 
          resolve: { 
           productResource: "productResource", 
           product: function(productResource, $stateParams) { 
            var productId = $stateParams.Id; 
            return productResource.get({ productId: productId }).$promise; 
           } 
          } 
         }); 

productResource.jsはProductController.csでWEBAPI方法は

public class ProductsController : ApiController 
    { 
     private IProductProvider _productProvider; 

     public ProductsController(IProductProvider productProvider) 
     { 
      this._productProvider = productProvider; 
     } 

     // GET: Porducts 
     public IEnumerable<Products> Get() 
     { 
      return _productProvider.GetProductData(); 
     } 

     public Products Get(int id) 
     { 
      var product = _productProvider.GetProductData(); 

      var products = product.FirstOrDefault((p) => p.Id == id); 
      return products; 
     } 
    } 

ファイル

(function() { 

    angular 
     .module("common.services") 
     .factory("productResource", 
     ["$resource", productResource]); 

    function productResource($resource) { 
     return $resource("/api/products/:id", 
      { 

       query: { 
        method: 'GET', 
        isArray: true 
       } 
      }); 
    } 
}()); 

を提出誰かが問題が何であるかを教えてもらえますか？理想的には、ユーザーがハイパーリンク列をクリックしたときに、productDetails状態が有効になり、productDetailView.htmlが表示されるはずです。また、Public Products Get（int id）WebApiメソッドを呼び出す必要があります。

Answer 1

はあなたのルートパラメータはid次のように定義されます

$resource("/api/products/:id", 
     { 

      query: { 
       method: 'GET', 
       isArray: true 
      } 
     }); 

いますが、キー

productResource.get({ productId: productId }) 

変化としてproductIdでオブジェクトを渡しているパラメータは、これに反対：

productResource.get({ id: productId }) 

ブラウザのコンソールでHTTPの再確認を必ず確認してくださいURI関連の問題をデバッグする必要がある場合はsponseエラーです。