SORU
27 Mayıs 2013, PAZARTESİ


AngularJS tohumu: ayrı dosyalar (app.js, controllers.js, directives.js, filters.js, services.js içine JavaScript koymak

angular-seed şablon benim uygulama yapısı için kullanıyorum. Başlangıçta tek bir dosya içine tüm JavaScript kodu, main.js koydum. Bu dosya modülü benim ifadem, denetleyicileri, direktifler, filtreler ve hizmetleri içeriyor. Uygulama bu şekilde gayet iyi çalışıyor, ama ölçülebilirlik ve benim uygulama daha karmaşık hale geldikçe bakımı için endişeleniyorum. Fark ettim ki açısal tohum şablonu ayrı dosyaların her biri için bu, bana da öyle çalıştı dağıtmak kodumu gelen tek main.js dosyası içine her diğer dosyalar bahsi geçen başlık için bu soru ve bulunan app/js dizinin angular-seed şablon.

Benim soru: nasıl bağımlılıklar çalışmak için uygulama almak için yönetirim? Varolan belgeleri here verilen örnekler her biri tek bir JavaScript kaynak dosya gösterdiğinden bu konuda çok net değil bulundu.

Ben bir örnektir:

app.js

angular.module('myApp', 
    ['myApp.filters',
     'myApp.services',
     'myApp.controllers']);

controllers.js

angular.module('myApp.controllers', []).
    controller('AppCtrl', [function ($scope, $http, $filter, MyService) {

        $scope.myService = MyService; // found in services.js

        // other functions...
    }
]);

filters.js

angular.module('myApp.filters', []).
    filter('myFilter', [function (MyService) {
        return function(value) {
            if (MyService.data) { // test to ensure service is loaded
                for (var i = 0; i < MyService.data.length; i  ) {
                    // code to return appropriate value from MyService
                }
            }
        }
    }]
);

services.js

angular.module('myApp.services', []).
    factory('MyService', function($http) {
        var MyService = {};
        $http.get('resources/data.json').success(function(response) {
            MyService.data = response;
        });
        return MyService;
    }
);

main.js

/* This is the single file I want to separate into the others */
var myApp = angular.module('myApp'), []);

myApp.factory('MyService', function($http) {
    // same code as in services.js
}

myApp.filter('myFilter', function(MyService) {
    // same code as in filters.js
}

function AppCtrl ($scope, $http, $filter, MyService) {
    // same code as in app.js
}

Bağımlılıklar nasıl yönetirim?

Şimdiden teşekkürler.

CEVAP
27 Mayıs 2013, PAZARTESİ


Sorun "" hepsi ayrı dosyaları. uygulama modülü redeclaring dan kaynaklanıyor

Bu uygulama modülü bildirim (emin değilim beyanı doğru terimdir) gibi görünür:

angular.module('myApp', []).controller( //...

Bu uygulama modül atama değil emin eğer atama doğru terim ya da (varsa) gibi görünür:

angular.module('myApp').controller( //...

Köşeli parantez eksikliği fark.

Yani, eski sürüm, birileköşeli parantez, sadece bir kez, genellikle ** 17 main.js kullanılmalıdır. Diğer tüm ilgili dosyalarıkontrolörler, direktifler, filtreler... — en son sürümü, bir kullanmalısınızolmadanköşeli parantez.

Bu mantıklı umuyoruz. Şerefe!

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Dogbert files

    Dogbert file

    12 Ocak 2012
  • LinusTechTips

    LinusTechTip

    25 Kasım 2008
  • Snazzy Labs

    Snazzy Labs

    9 Aralık 2008