2017-06-22 78 views
0

如何添加列表中的Java在我的代碼angularJs用於過濾我想顯示使用Java數據的列表,並angularjs

這是ProductController.java

在這種控制器是回List的數據到UI。

@Controller 
@RequestMapping("/product") 

    public class ProductController { 

    @Autowired 
    private ProductService productService; 

    @RequestMapping("/ProductList") 
    public String getProducts(Model model) 
    { 
     List<Product> products = productService.getProductList(); 
     model.addAttribute("products",products); 
     return "productList"; 
    } 

    @RequestMapping("viewProduct/{productId}") 
    public String viewProduct(@PathVariable int productId,Model model)throws IOException 
    { 
     Product product = productService.getProductById(productId); 
     model.addAttribute(product); 
     return "viewProduct"; 
    } 

} 

Html和angularjs與此職能的是頁面內容的HTML沒有列出

 <p>Type a letter in the input field:</p> 

     <p><input type="text" ng-model="products"></p> 

     <ul> 
      <li ng-repeat="x in products | filter:products"> 
       {{ x }} 
      </li> 
     </ul> 

    </div> 


    <script> 
     angular.module('myApp', []).controller('namesCtrl', function($scope,$http) { 
      $http.get("/eMusicStore/product/ProductList/"+$scope.cartId).success(function (data) { 
       console.log("success: " + data); 
       $scope.products = products; 
      }); 
     }); 
    </script> 
+0

在NG-重複你需要使用的書,而不是產品。 – Akash

+1

當調用從角這樣的要求,你只是一個JSON字符串,而不是一個網頁嗎?但是你的Spring webpp在這裏發送一個視圖(html)。這些客戶端和服務器不匹配。 –

+0

THX的幫助這是probleme如何從angularJs –

回答

0
//Try this one..hope it helps and make sense 
<p>Type a letter in the input field:</p> 
    <p><input type="text" ng-model="product"></p> 
    <ul> 
     <li ng-repeat="x in products | filter:product track by $index"> 
      {{ x }} 
     </li> 
    </ul> 
</div> 

<script> 
    angular.module('myApp', []).controller('namesCtrl', function($scope,$http) { 
     $http.get("/eMusicStore/product/ProductList/"+$scope.cartId). 
     then(function (result) { 
      console.log("success: " + result.data); 
      $scope.products = result.data; 
     }, function(err){ 
      console.log('err',err); 
     }); 
    }); 
</script> 
+0

發送JSON請比較我的代碼,你的code..u會發現一些變化.. –

+0

如果你的API返回的Java的完整列表,那麼肯定是我的代碼會顯示Java的名單。 。 –

+0

你是如何處理因爲控制器的HTML/VIEW響應返回JSP,不是JSON? –

相關問題