Bir $ http isteği devamı

'dan açısal ui.grid'de görünecek verileri nasıl alabilirim? Tamam, bunu mümkün olduğunca kısa tutacağım.

Şu an için Angular çalışıyorum ve hala öğrenmem gereken çok şey var, şu anda başlarına tamamen yeni bir servisle başlıkları nasıl bağlayacağımı anlamaya çalışıyorum hiç bir zaman sonuyla bütünleşmeyi bitirmedim.

Aşağıdaki kod başka bir yığın taşması yanıtından sağlanır ve bilmek istediklerim dataService.js adıyla sahip olduklarına nasıl bağlanır. Bu benim için tüm yeni, bu yüzden mümkün olan en iyi şekilde sormaya çalışıyorum. Sağlanan

<!DOCTYPE html> 
<html > 
<head> 
    <meta charset="utf-8" /> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 
</head> 
<body ng-app="app"> 
    <div ng-controller="gridController"> 
     <!-- Initialise the grid with ng-init call --> 
     <div ui-grid="gridOptions" ng-init="GetGridData(urlList)"> 
     </div> 
    </div> 

    <script src="Scripts/ng/angular.min.js"></script> 
    <script src="Scripts/ng-grid/ui-grid.min.js"></script> 
    <link rel="Stylesheet" type="text/css" href="Scripts/ng-grid/ui-rid.min.css" /> 

    <script type="text/javascript"> 

     var app = angular.module('app', ['ui.grid']); 

     app.controller("gridController", 
      ["$scope", "$attrs", "$element", "$compile", "$http", "$q", 
      function ($scope, $attrs, $element, $compile, $http, $q) 
      { 
       $scope.urlList = "YourSourceUrl"; 

       function fnGetList(url) 
       { 
        var deferred = $q.defer(); 
        $http.get(url) 
         .success(function (data) 
         { 
          deferred.resolve(data); 
         }) 
         .error(function (errorMessage) 
         { 
          alert(errorMessage); 
          deferred.reject; 
         }); 
        return deferred.promise; 
       }; 

       $scope.GetGridData = function (url) 
       { 
        console.log("In GetGridData: " + "Getting the data"); 

        // Test Only - un-comment if you need to test the grid statically. 

        //$scope.loadData = ([ 
        //  { 
        //   "UserName": "Joe.Doe", 
        //   "Email": "[email protected]" 
        //  }, 
        //  { 
        //   "UserName": "Jane.Doe", 
        //   "Email": "[email protected]om" 
        //  }, 
        //]); 
        //return; 

        fnGetList(url).then(function (content) 
        { 
         // Assuming your content.data contains a well-formed JSON 

         if (content.data !== undefined) 
         { 
          $scope.loadData = JSON.parse(content.data); 
         } 
        }); 
       }; 

       $scope.gridOptions = 
       { 
        data: 'loadData', 
        columnDef: 
         [ 
          { field: 'UserName', name: 'User' }, 
          { field: 'Email', name: 'e-mail' } 
         ] 
       }; 

      } 
     ]); 
</script> 

</body>

: How do I get data to show up in angular ui.grid from an $http request

kaynak

2016-04-14 Dr Mints

$ scope.urlList = "YourSourceUrl"; <== Kullandığınız bir URL'niz var mı, doğru bir şekilde ayarlandı mı ve Postman veya başka bir araç aracılığıyla veri döndürdüğünü gördünüz mü? –

kullandığım yöntem bir AJAX araması olarak URL geçmek ve verileri geri almak için hangi sonra ng şebekeye JSON veri bağlantı daha sonra beklemek. Verilerin URL'den geri alınmasında bir gecikme olacağını ve veri geri dönüşünün geçerli olmaya başladığını kontrol etmeye devam edecek bir zamanlayıcıya sahip olmanız gerektiğini unutmayın.

function setCar(){ 
$.ajax({ 
    type: "POST", 
    url: '/Test/ConfigConnect.json?details=&car='+car+'&id=1', 
    dataType: 'json', 
    success: function(data){ 
     configData = data; 
    } 
});}

Javascirpt'in bir parçası olan zamanlayıcı işlevi de aşağıda verilmiştir.

var timer = setInterval(function() { 
     $scope.$apply(updatePage); 
}, 500); 

var updatePage = function() {  
    if (typeof configData !== 'undefined') 
    { 
     clearInterval(timer); 
     $scope.loadData = configData; 
    } 
};

kaynak

2016-04-14 22:34:48 user4534599

Geri bildirimi takdir ediyorum, cevap vermediğim için üzgünüm :) –

cevap

İlgili konular