我想使用java和angularjs显示数据列表

Question

  

如何在我的Code angularJs中为过滤器添加列表java

这是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>

Answer 1

//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>