从控制器返回不完整的JSON数据 - AngularJS

我是AngularJS的新手，尝试使用AngularJS 1.x处理单页购物车功能。我从显示产品列表的位置获取JSON数据。该观点是如下：从控制器返回不完整的JSON数据 - AngularJS

当我点击“详细信息”按钮，它也会rediredting的产品详细信息页面。虽然这样做，我遇到了一个错误：

语法错误：JSON输入

其背后的原因是JSON数据意外结束。在调用过程中检索到的JSON数据并不完整，因此是错误。下面记录的JSON数据是：

{ “P_ID”： “1”， “p_name”： “棉T恤”， “p_variation”： “固体绿色”， “p_style”： “ms13kt1906”， “p_selected_color”： { “名”： “蓝”， “十六进制编码”：” 因此我得到了以下观点：

我的控制器代码是：

angular.module('myApp.product.controllers', []). 
controller('ProductsController', 
['$scope', '$log', '$http', '$state', 
function ($scope, $log, $http, $state) { 

    $log.log('inside product controller'); 
    $http.get('data/cart.json'). 
    success(function (data) { 
     $scope.products = data.productsInCart; 
    }). 
    error(function() { 
     $log.log('could not find cart.json'); 
    });  
}]). 
controller('ProductDetailsController', 
['$scope', '$log', '$stateParams', 
function ($scope, $log, $stateParams) { 

    $log.log('inside product details controller ' + $stateParams.product); 
    $scope.eachData = JSON.parse($stateParams.product); 

}]);

的 '部分' 的代码是：

<div class="container main"> 
    <div class="row"> 
     <div class="col-md-4"> 
      <img ng-src="img/{{eachData.p_image}}" class="img-responsive" alt="product image"> 
     </div> 
     <div class="col-md-8"> 
      <div class="thumbnail"> 
       <div class="caption-full"> 
        <h4 class="pull-right">{{eachData.p_originalprice}}</h4> 
        <h4><a href="#">{{eachData.p_name}}</a></h4> 
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</p> 
        <p class="text-right"> 
         <a href="#" class="btn btn-primary">Buy Now!</a> 
        </p> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

我的模块代码是：

angular.module('cartApp.product').config([ 
    '$locationProvider', '$stateProvider', 
    function($locationProvider, $stateProvider){ 
     $stateProvider.state('products', { 
      url: '/products', 
      controller: 'ProductsController', 
      templateUrl: 'module/products/views/products.html' 
     }); 
     $stateProvider.state('productsDetails', { 
      url: '/details/:product', 
      controller: 'ProductDetailsController', 
      templateUrl: 'module/products/views/details.html' 
     }); 
    } 
]);

在我的网址我得到了整个JSON数据，但是当我试图找回它，使用它为我的视图页面，返回的JSON数据不完整，因此错误。

请帮我理解为什么当我在我的控制器中使用它时返回的JSON数据不完整。

指导我解决问题。

预先感谢您。

来源

2017-03-16 NoviceCoder

从哪里获取json到详细信息页面？你能提供一些更多的代码或者一些jsfiddle来模拟这种行为吗？ –

我有我的JSON文件在我的本地目录，我使用'$ http.get（'data/cart.json'）。 \t成功（功能（数据）{ \t \t $ scope.products = data.productsInCart; \t}）' 访问JSON。我已经编辑了上面的控制器代码以便更好地理解。 – NoviceCoder

您是否尝试将整个JSON字符串作为URL参数传递？这可能不是一个好主意。 –

感谢@BrianGlaz我能解决这个问题。我的JSON有十六进制代码的＃值。这导致了休息。现在它从所有的十六进制代码中删除＃后工作正常。

感谢所有花时间阅读和回应我的查询。

来源

2017-03-16 19:54:30 NoviceCoder

从控制器返回不完整的JSON数据 - AngularJS

回答

相关问题