Nasıl ng-model benim angular.js içine json yüklemek için?

SORU

22 EKİM 2012, PAZARTESİ

Nasıl ng-model benim angular.js içine json yüklemek için?

Muhtemelen çok açık bir soru olduğunu düşündüğüm, ama cevabını hiçbir yerde bulamadım.

Sadece istemci içine benim sunucudan bazı JSON veri yüklemek için çalışıyorum. Şu anda dil eklentisi AJAX çağrısı (kod aşağıda) ile yüklemek için kullanıyorum.

<script type="text/javascript">
var global = new Array();
$.ajax({
    url: "/json",
    success: function(reports){
        global = reports;
        return global;
        }
    });
</script>

Bu html dosyası içinde yer almaktadır. Şimdiye kadar çalışır, ama sorun AngularJS kullanmak istiyorum. Açısal değişkenleri kullanmak varken, her döngü için bir ben bir değişken içine her şeyi yük olamam. Bu da ilgili gözüküyor "$Kapsam genellikle yer almaktadır.",dosya js.

Sorunun bir diğer sayfalardan yük kod veremem .dosya js. Açısal her örnek, sadece bu gibi şeyler gösterir:

function TodoCtrl($scope) {
  $scope.todos = [
    {text:'learn angular', done:true},
    {text:'build an angular app', done:false}];

Ben eğer öyleyse, bu yararlıdır A) bu, tüm elle yazın VE B) Eğer tüm verileri... . önceden biliyorum

Önceden bilmiyorum (veri, dinamik) ve yazmak istemiyorum.

Kaynak Açısal kullanarak $AJAX çağrısı değiştirmek için denedim, işe yaramıyor. Belki de bunu anlayamıyorum, ama nispeten basit bir JSON veri için istek OLSUN.

tl:AJAX çağrıları açısal bir modele harici veri yüklemek için işe gidemiyorum dr.

CEVAP

23 EKİM 2012, Salı

Kris olarak bahseder kullanabilirsiniz $resource service için etkileşim ile sunucu, ama benim edindiğim izlenim, senin başına yolculuk ile Açısal - oradaydım geçen hafta - ben tavsiye için başlangıç deneme ile doğrudan $http servis. Bu durumda get kendi yöntemini çağırabilirsiniz.

Aşağıdaki JSON varsa

[{ "text":"learn angular", "done":true },
 { "text":"build an angular app", "done":false},
 { "text":"something", "done":false },
 { "text":"another todo", "done":true }]

Bu şekilde yükleyebilirsiniz

var App = angular.module('App', []);

App.controller('TodoCtrl', function($scope, $http) {
  $http.get('todos.json')
       .then(function(res){
          $scope.todos = res.data;                
        });
});

get yöntem döndürürsözhangi nesne ilk bağımsız değişkenbaşarıgeri arama ve ikinci birhata geri arama.

Ne zaman büyü yapar işlevi bir Açısal parametre olarak $http Ekle ve denetleyici içine $http kaynak enjekte ediyor.

Burada bazı örnekler koydum

Bunu Paylaş: