Angular.js Uncaught SyntaxError:意外的令牌:

时间:2016-05-25 19:43:28

标签: angularjs

我正在使用Angurlar.js来调用我的Web API,我收到的错误是:

P01:1 Uncaught SyntaxError: Unexpected token : and in resources tab it is being shown that these braces should not be there {"ProductID1":"P01","ProductName1":"Pen","Quantity1":10,"Price1":12.0} kindly help me

这是我的角度代码:

var app = angular.module('store', []);
    app.controller('StoreController', ['$http', '$scope', function ($http, $scope) {

        $scope.display = function () {

            //  $http.get('http://localhost:17279/api/Product/GetProduct/' + $scope.pid).success(function (data) {
            $http({
                method: 'jsonp',
                url: 'http://localhost:17279/api/Product/GetProduct/' + $scope.pid,
                params: {
                    format: 'jsonp',
                    json_callback: 'JSON_CALLBACK'
                }
            }).success(function (data) {
                {{data}}
            });
        }
    }]);

下面的代码在我的WebAPI控制器中

List<Product> productList = new List<Product>{
            new       Product{ProductID1="P01",ProductName1="Pen",Quantity1=10,Price1=12},
             new Product{ProductID1="P02",ProductName1="Copy",Quantity1=12,Price1=20},
             new Product{ProductID1="P03",ProductName1="Pencil",Quantity1=15,Price1=22},
             new Product{ProductID1="P04",ProductName1="Eraser",Quantity1=20,Price1=27},
        };
    public List<Product> GetProductList()
    {
        return productList;
    }
    public IHttpActionResult GetProduct(string id)
    {
        var product = productList.FirstOrDefault(
            (p) => p.ProductID1 == id);
        if(product == null)
        {
            return NotFound();
        }
        return Ok(product);
    }

除此之外,我在WebAPI中有一个产品模型类,它有4个成员及其属性,即:价格,数量,产品ID,产品名称

1 个答案:

答案 0 :(得分:0)

删除{{data}}回调中的success。这是将表达式绑定到视图的有角度的方式,不应在您的javascript代码中使用

$scope.display = function () {
    $http({
        method: 'jsonp',
        url: 'http://localhost:17279/api/Product/GetProduct/' + $scope.pid,
        params: {
            format: 'jsonp',
            json_callback: 'JSON_CALLBACK'
        }
     }).then(function (data) {
        $scope.data = data;
     });
}