2015-07-07 15 views
15

Bu, Angular'ın RESTFul apis uygulamasının kablolu hale getirilmemesi için kullanılacak verileri alamaya izin verdiğini okudum. Bir UX tasarımcısının sadece kozmetik ürünlere bakması gereken ve bir web sunucusuna bağlanması gereken bir kullanım durumunu düşünebilirim. Diğer kullanım durumlarını da düşünebilirim.Açısal çalışacak bir web sunucusuna ihtiyaç duyar mı? Tarayıcıya yerel bir dosyanın URL'sini verirsem Angular çalışır mı?

Yani Angular çalışması, tarayıcıya C: \ temp \ index.html gibi bir yerel dosyanın URL'sini veriyorum ve js dosyaları c: \ temp veya c: \ temp \ js dır.

Yani aslında, burada (Ben ayrılmalıdır biliyorum)

<html ng-app="myNoteApp"> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
<body> 

<div ng-controller="myNoteCtrl"> 

<h2>My Note</h2> 

<p><textarea ng-model="message" cols="40" rows="10"></textarea></p> 

<p> 
<button ng-click="save()">Save</button> 
<button ng-click="clear()">Clear</button> 
</p> 

<p>Number of characters left: <span ng-bind="left()"></span></p> 

</div> 

<script > 
// was in separate file but pasted in for demo purposes 
var app = angular.module("myNoteApp", []); 

</script> 
<script > 
// was in separate file but pasted in for demo purposes 
app.controller("myNoteCtrl", function($scope) { 
    $scope.message = ""; 
    $scope.left = function() {return 100 - $scope.message.length;}; 
    $scope.clear = function() {$scope.message = "";}; 
    $scope.save = function() {alert("Note Saved:" + $scope.message);}; 
}); 
</script> 
</body> 
</html> 

sonuçlarının başlangıçta IE içerik engeller, bu Chrome ve Firefox herhangi bir sorun çalışır, yalnızca bir iki uygulama dosyasında olduğunu denedim ama biri koşmasına izin verebilir.

Yanıtlara teşekkürler. Muhtemelen bu soruyu sileceğim çünkü insanlar bunu reddetti. Aslında bunun yararlı bir bulgu olduğunu düşünüyorum ama topluluk en iyisini bilir.

+0

Denemeyi denediniz mi? – baao

+3

Denediğinizde ne olur? Evet, herhangi bir AJAX isteğinde bulunmadığınız sürece işe yarayacaktır. –

+1

Tamam, ben yaptım ve değiştirdim soru. Özür dilerim ama ben yenisini tamamlıyorum. –

cevap

2

Yani, bu yaptığım yolu geçici hizmet oluşturmak ve sadece url/dosyadan o yerine yüklemektir.

Örnek:

//tempUser.js 
angular.module("app").constant("tempUser", { 
    firstname : "Joe", 
    lastname : "Smith" 
}); 

//userService.js 
angular.module("app").factory("userService", function ($q, tempUser) { 
    return { 
     load : load 
    }; 

    function load(id) { 
     //TODO: finish impl 
     return $q.when(tempUser); 
    } 
}); 

Bir web hizmetinden yerleştirir gibi kontrolör hala çalışabilir Bu şekilde. Eğer sadece bir div içinde {{mymessage}} gibi bir ifade kullanarak veri göstermek gerekirse

angular.module("app").controller("UserDetailCtrl", function (userService) { 
    userService.load().then(function (user) { 
     $scope.user = user; 
    }); 
}); 
8

Kökeni etki alanı hataları alacağınız için açısal bir uygulamaya yerel makinedeki dosya yolundan erişemezsiniz.

Çözüm, http-server (which requires node.js to be installed)'u yüklemektir. Bu, makinenize yerel bir http sunucusu oluşturmanıza olanak tanır ve Angular uygulamasına geliştirme ve test amacıyla çevrimiçi olarak barındırılıyormuş gibi erişmenizi sağlar.

+4

Aslında bir AngularJS uygulamasını, AJAX isteklerine (yönlendirme, ng-includes, templateUrls, vb.) Ihtiyaç duymadığınız sürece çalıştırabilirsiniz. – yvesmancera

+1

Benim durumumda böyle değil ama IIRC Firefox, etki alanı hataları böylece deneyiminiz farklı olabilir. –

+0

Neden "çapraz kaynaklı etki alanı hataları alacaksınız" açıklayabilir misiniz? Bu Angular ile ne ilgisi var? –

0

, bir web sunucusu gerekmez.

Ancak html dosyalarını uing ngview yüklemeniz gerekiyorsa, bir web sunucusuna ihtiyacınız var - aksi halde aşağıdaki hatadan şikayetçi olur.

istek dosyasını yükleyemiyor. http veriler, krom, krom uzantısı, https, krom-extension-kaynak: Çapraz kökenli istekleri sadece protokol düzenleri için desteklenir. şablonları laoding angularjs yönlendirme öğrenmek için gerekirse

, ben web serverexe kullanımı kolay buldum - HFS. Şimdiye kadar angularjs öğrenmek için benim gereksinimlerini karşılar.

Kaynaklar

2

Evet yerel bir dosyayı çalıştırabilir, ancak bir sunucusundan verileri gerekiyorsa, tarayıcı dayanarak bunu engellemeniz gerekir HFS:Introduction

  • HTTP File Server neyi çalıştırdığınız tarayıcının sürümü ve türü. Eğik uygulamalar tamamen istemci tarafı kod iken Running the Development Web Server

    ve bunun için daha iyidir, dosya sisteminden doğrudan bir web tarayıcısında bunları açmak mümkündür: Burada

    resmi angularjs Eğitimi açıklama onları bir HTTP web sunucusundan sunun. Özellikle güvenlik nedenleriyle, çoğu modern tarayıcı, sayfa doğrudan dosya sisteminden yüklendiğinde JavaScript'in sunucu istekleri yapmasına izin vermez.

  • 0

    Güncelleme: Benim önerim aşağıda angularjs için yeterince iyi çalıştı, ama sadece Bilginize Diğerleri söylediler Açısal 2.


    için yetersiz, http olarak düzgün hizmet etmek en iyisidir. Bununla birlikte, başka çözümler de vardır.

    Brackets gibi bazı düzenleyiciler (bir dosyadayken sağ üst köşedeki şimşeğin üzerine tıklayın), kodu tarayıcınıza doğru şekilde sunabilir. Diğerleri için bunu yapan eklentiler olabilir.

    Ayrıca, Chrome'daysanız, run it with flags yapabilirsiniz; bu, yolun .exe kısmının arkasında kısa bir yoldan bir şeyler eklediğiniz anlamına gelir; eğer yapacaksan seçenekler. Spesifik olarak:

    --allow-file-access-from-files --allow-file-access --allow-cross-origin-auth-prompt 
    

    Bu, çeşitli kaynaklardan dosyalara erişmeye çalışırken hata yapmamayı sağlar. Bunun için bir plugin vardı, ama işe yaramaya gelemedim. Güvenlik neden bu varsayılan değil, bu yüzden belki de ana kısaltmaya sörf yapmak için her zaman kullanmak zorunda değilsiniz ... - Kendi riski altında kullanın.

    İlgili konular