Seite 2 von 2 ErsteErste 12
Ergebnis 16 bis 26 von 26
Like Tree4Likes

Thema: Frage zu EJS Template Engine

  1. #16
    tsseh ist offline Foren-Gott
    registriert
    19-05-2008
    Beiträge
    5.667

    AW: Frage zu EJS Template Engine

    Zitat Zitat von alphakanal Beitrag anzeigen
    Das lässt sich mit dem Package gulp-ng-annotate beheben.
    angular selbst unterstützt abhängigkeiten, diese kann und sollte man meiner meinung nach explizit angeben.
    z.b. eine controller deklaration
    Code:
    .controller('MyController', [
      '$scope',
      '$timeout',
      function (myScope, to)
      {
    welche auf $scope und $timeout zugreift wird beim instanziieren mit diesen beiden parametern aufgerufen. dazu muss angular aber wissen, welche beiden parameter übergeben werden sollen. das passiert über die elemente im array vor der funktion, also die strings '$scope' und '$timeout'. damit weiß angular dann, dass es beim erzeugen des controllers die objekte $scope und $timeout übergeben muss.
    jetzt bietet angular auch einen impliziten weg an, indem es die variablennamen der funktion nimmt um damit die objekte zu suchen.
    Code:
    .controller('MyController', function ($scope, $timeout)
      {
    das würde ich so nicht machen. schon weil du dann deine funktionsparameter immer nach den angular-objekten benennen musst. das ist hier bei $scope und $timeout vielleicht noch nicht das problem, aber du bist damit festgelegt.

    und diese festlegung wird durch minimisation tatsächlich kaputgemacht. deswegen erst recht, nutze den expliziten weg.
    alphakanal likes this.

  2. #17
    Avatar von alphakanal
    alphakanal ist offline Foren As
    registriert
    03-12-2016
    Beiträge
    92

    AW: Frage zu EJS Template Engine

    Zitat Zitat von tsseh Beitrag anzeigen
    ..und diese festlegung wird durch minimisation tatsächlich kaputgemacht. deswegen erst recht, nutze den expliziten weg.
    Danke. In dem Übungsprojekt wurde die Methode mit gulp-ng-annotate verwendet um nicht sämtliche Controller wieder umzuschreiben.

    Jedefalls habe ich jetzt soweit verstanden und versuche mich brav an deinen Rat zu halten. Habe in meinem Übungsprojekt folgenden Viewcontroller ( mainController ) danach angepasst :
    Code:
    (function() {
    
        var app = angular.module("mainController");
    
        var mainController = function($scope, $interval) {
    
           var decrement = function(){
               .....
            };
    
            var starteCountdown = function(){
                ....
            };
    
            $scope.username = "angular";
            $scope.countdown = 5;
            starteCountdown();
        };
    
        app.controller("mainController", ["$scope", "$interval", mainController ] );
    
    }());

    Jetzt versuche ich das Ganze in das Angular Seed Projekt zu portieren. Aber statt mit IFFEs wird im Seed bei den Viewcontrollern bzw generell mit 'use strict' gearbeitet - da sieht mein mainController wie folgt aus :

    Code:
    'use strict';
    angular.module('ewApp.main', ['ngRoute'])
    
    .config(['$routeProvider', function($routeProvider) {
      $routeProvider.when('/main', {
        templateUrl: 'views/main/main.html',
        controller: 'mainController'
      });
    }])
    
    // .controller("mainController", ["$scope", "$interval", mainController ] );
    .controller('mainController', [function() {
    
    }]);
    Jetzt hänge ich seit ner Zeit an dem Problem dass ich nicht hingkriege wie ich hier die im Controller oben erstellten Funktionen ( starteCountdown, decrement ) sowie $scope + $interval einbaue bzw. weitergebe? Könntest Du mir hier evtl ein Beispiel bittsche geben? Wäre ein kleiner Schritt für Profis aber riesen Schritt für mich :-)
    Geändert von alphakanal (23-12-2016 um 18:03 Uhr)
    "640 Kilobyte ought to be enough for anybody."
    Bill Gates, 1981

  3. #18
    tsseh ist offline Foren-Gott
    registriert
    19-05-2008
    Beiträge
    5.667

    AW: Frage zu EJS Template Engine

    ich verstehe dein problem nicht.
    was hat das mit strict zu tun?
    mainController ist einfach eine funktion.
    den zusätzlichen scope (function() {...}()); außenrum würde ich beibehalten.
    du doch einfach
    Code:
    (function() {
        'use strict';
        
        var app = angular.module('ewApp.main', ['ngRoute']);
        
        var mainController = function($scope, $interval)
        {
           ...
        };
    
        app.config(['$routeProvider', function($routeProvider)
        {
          $routeProvider.when('/main', {
            templateUrl: 'views/main/main.html',
            controller: 'mainController'
          });
        }]);
        app.controller("mainController", ["$scope", "$interval", mainController ] );
    }());
    oder
    Code:
    (function() {
        'use strict';
        
        angular.module('ewApp.main', ['ngRoute'])
    
        .config(['$routeProvider', function($routeProvider) {
          $routeProvider.when('/main', {
            templateUrl: 'views/main/main.html',
            controller: 'mainController'
          });
        }])
        .controller('mainController', ["$scope", "$interval", function()
        {
        }]);
    }());
    schreiben
    alphakanal likes this.

  4. #19
    Avatar von alphakanal
    alphakanal ist offline Foren As
    registriert
    03-12-2016
    Beiträge
    92

    AW: Frage zu EJS Template Engine

    Zitat Zitat von tsseh Beitrag anzeigen
    ich verstehe dein problem nicht.
    was hat das mit strict zu tun?
    Dachte dass durch 'use strict' die Funktionen usw. im mainController nicht im GlobalScope erscheinen und somit der IFFE überflüssig ist.


    Jedenfall wenn ich das so einbaue, da leuchtet aber JSHint im Editor wie ein Weihnachtsbaum

    UPDATE:

    YEAH!!!! Semikolons vergessen -- DANKE!!!!!!!!!!!!
    Geändert von alphakanal (23-12-2016 um 18:18 Uhr)
    "640 Kilobyte ought to be enough for anybody."
    Bill Gates, 1981

  5. #20
    Avatar von alphakanal
    alphakanal ist offline Foren As
    registriert
    03-12-2016
    Beiträge
    92

    AW: Frage zu EJS Template Engine

    So hoffe alle hatten ein entspanntes und ruhiges Weihnachtsfest

    Trotz Feiertage juckts mich und arbeite weiter an meinem ersteb Angular Projekt -> Danke nochmal für die Empfehlung - ist echt top!!!!

    Versuche jetzt meinen Code - der momentan überwiegend im MainController liegt - ein wenig zu überarbeiten und in separate Factories auszulagern.
    Hilfe hierzu finde ich auch hier im StyleGuide von John Papa - wobei nicht alles verstanden wird ;-)

    In meiner Factory verwiese ich auf das app.modul:
    Code:
    (function() {
      
    'use strict';
    
    var app = angular.module('ewApp', [
      'ngRoute',
      'ngAnimate',
      'ewApp.main', 
      'ewApp.drucken',
      'ewApp.login',
      'ewApp.hilfe',
      'ewApp.speichern'
    ]); 
    
    app.factory('meinService', function(){
        var meineVariable = 'mein Wert';
        return {
    
            // meine rückgabe
            ausgabe : meineVariable
    
        };
    
    });
    Der rot markierte Code steht ja ebenfalls in meiner app.js:

    Code:
    'use strict';
    
    angular.module('ewApp', [  // Mein Root Modul
      'ngRoute',
      'ngAnimate',
      'ewApp.main', // meine 5 Views / separate HTMLs -->
      'ewApp.drucken',
      'ewApp.login',
      'ewApp.hilfe',
      'ewApp.speichern'
    ])
    .config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) {
      $locationProvider.hashPrefix('!');
    
      $routeProvider.otherwise({redirectTo: '/main'});
    }]);
    Angenommen ich füge in meine app.js neue Dependecies hinzu ( falls die Bezeichnung nicht stimmt: ich meine die Werte im Array: 'ngRoute', 'ngAnimate' etc. ), muss ich die dann doch auch in jeden meiner Factories hinzufügen, oder sehe ich das falsch? Zumindest musste ich das bisher, da sonst der Bildschirm leer blieb - jedoch ohne Fehlermeldungen in der Konsole.

    Mache ich das komplizierter als es wirklich sein muss oder ist das einfach so?
    Gibt's eine Methode um nachträglich zur app.js hinzugefügte Dependencies nicht auch noch zusätzlich manuell in jede Factory einzutragen zu müssen?

    - - - Aktualisiert - - -

    Problem Update:

    Ich habe jetzt versucht eine zweite Factory einzubauen:
    Code:
    (function() {
      
    'use strict';
    
    var app = angular.module('ewApp', [
      'ngRoute',
      'ngAnimate',
      'ewApp.main', 
      'ewApp.drucken',
      'ewApp.login',
      'ewApp.hilfe',
      'ewApp.speichern'
    ]); 
    
    app.factory('meinService2', function(){
        var meineVariable = 'mein Wert aus Service 2';
        return {
    
            // meine rückgabe
            ausgabe : meineVariable
    
        };
    
    });
    Sobald ich diese aber in meinen viewController mit einbinde:

    Code:
    (function () {
        'use strict';
    
        var app = angular.module('ewApp.main', ['ngRoute']);
    
        var mainController = function ($scope, meinService, meinService2) {
    .....
    };
    
        app.config(['$routeProvider', function ($routeProvider) {
            $routeProvider.when('/main', {
                templateUrl: 'views/main/main.html',
                controller: 'mainController'
            });
        }]);
        app.controller("mainController", ["$scope", "meinService", "meinService2" , mainController]);
    } ());
    Bekomme folgende Fehlermeldung:
    Error: [$injector:unpr] Unknown provider: meinService2Provider <- meinService2 <- mainController


    Verstehe ich jetzt nicht ganz wo hier der Fehler mit provider zustande kommt, mit der ersten Factory lief es ja ohne Fehlermeldung. Der Code und das Einbinden ist ja quasi identisch

    Problem gelöst :
    Hab jetzt in der Factory nur
    var app = angular.module('ewApp');
    Ohne routing gedöns
    Geändert von alphakanal (26-12-2016 um 18:08 Uhr)

  6. #21
    tsseh ist offline Foren-Gott
    registriert
    19-05-2008
    Beiträge
    5.667

    AW: Frage zu EJS Template Engine

    mit
    Code:
    angular.module('ewApp', [
      'ngRoute',
      'ngAnimate',
      'ewApp.main', 
      'ewApp.drucken',
      'ewApp.login',
      'ewApp.hilfe',
      'ewApp.speichern'
    ])
    definierst du ein modul. darauf kannst du später nochmal über
    Code:
    angular.module('ewApp')
    zugreifen. wenn du aber wieder abhängigkeiten angibst (also wie ganz oben), will angular wieder ein modul anlegen, das modul 'ewApp' existiert aber schon.
    ein weiteres modul kannst du aber problemlos anlegen
    Code:
    angular.module('ewApp.main', ['ngRoute']);
    und dieses auch als abhängigkeit bei einem anderen modul eintragen
    alphakanal likes this.

  7. #22
    Avatar von alphakanal
    alphakanal ist offline Foren As
    registriert
    03-12-2016
    Beiträge
    92

    AW: Frage zu EJS Template Engine

    Super !
    Bisher war s nur eine grobe Vorstellung dessen was da im Hintergrund schiefgelaufen ist - jetzt kann ichs auch genau zuordnen, danke!!
    "640 Kilobyte ought to be enough for anybody."
    Bill Gates, 1981

  8. #23
    Avatar von alphakanal
    alphakanal ist offline Foren As
    registriert
    03-12-2016
    Beiträge
    92

    AW: Frage zu EJS Template Engine

    Kurze Frage ob Code Struktur meiner Directive so passt oder übertrieben kompliziert ist.

    In meinem mainView habe ich folgende Direktive ( separate JS-Datei ) mit eigener Controller-Funktion um auf das $scope Objet der mainView zuzugreifen:
    Code:
    (function () {
      'use strict';
    
      var app = angular.module('ewApp'); // Root Module
    
      app.directive('ewLabel', [ewLabel]);
    
      function ewLabel() {
    
        interneFunktion("Hallo");
    
        return {
          restrict: 'E',
          templateUrl: 'assets/templates/directives/label.html',
          controller: directiveController
        };
    
      }
    
      function interneFunktion(params) {
        console.log(params + " + aus interner Funktion " );
    
      }
      function directiveController($scope) {
        console.log("Aus dem DirectiveController Scope: " + $scope.text1 );
    
      }
    
    
    } ());
    Funktioniert, wackelt und hat Luft. Vor allem ich kanns nachvollziehbar lesen - daher kein Freund anonymer Funktionen.

    Jetzt würde es mich nur interessieren ob das eine "saubere" Lösung ist oder übertrieben kompliziert/verschachtelt ist?
    Geändert von alphakanal (28-12-2016 um 13:03 Uhr)
    "640 Kilobyte ought to be enough for anybody."
    Bill Gates, 1981

  9. #24
    tsseh ist offline Foren-Gott
    registriert
    19-05-2008
    Beiträge
    5.667

    AW: Frage zu EJS Template Engine

    Zitat Zitat von alphakanal Beitrag anzeigen
    Jetzt würde es mich nur interessieren ob das eine "saubere" Lösung ist oder übertrieben kompliziert/verschachtelt ist?
    etwas kompliziert/verschachteltes sehe ich nicht, aber wozu ist die interneFunktion da? den sinn des controllers sehe ich auch nicht. außerdem hast du beim controller dei abhängigkeiten nicht angegeben: controller: ['$scope', directiveController]

  10. #25
    Avatar von alphakanal
    alphakanal ist offline Foren As
    registriert
    03-12-2016
    Beiträge
    92

    AW: Frage zu EJS Template Engine

    Danke schon mal für die Antwort!
    Zitat Zitat von tsseh Beitrag anzeigen
    etwas kompliziert/verschachteltes sehe ich nicht, aber wozu ist die interneFunktion da?
    Keine Ahnung, die ist eigentlich nur da um zu sehen ob es funktioniert - falls ich sowas brauchen sollte. Wobei keine Ahnung nicht ganz stimmt -> da ich in diese Direktive ein Logik einbauen möchte welche momentan mehrere Funktionen aufruft.

    Zitat Zitat von tsseh Beitrag anzeigen
    den sinn des controllers sehe ich auch nicht
    Dachte ich brauch einen Controller um auf den scope es mainViews zugreifen zu können - und vor allem dass ich im Controller dann mein Canvas Element erstelle mit dem der User interagiert.

    Zitat Zitat von tsseh Beitrag anzeigen
    außerdem hast du beim controller dei abhängigkeiten nicht angegeben: controller: ['$scope', directiveController]
    Stimmt, danke wird ausgebessert - falls der Controller überhaupt noch bestand hat.

    Kann ich dann quasi die Direktive so aussen lassen:
    Code:
    (function () {
      'use strict';
    
      var app = angular.module('ewApp'); // Root Module
    
      app.directive('ewLabel', ["$scope", ewLabel]);
     // app.directive('ewLabel', [ewLabel]);
    
      function ewLabel() {
    //  function ewLabel($scope) {
    
        console.log("Aus der Direktive Scope: " + $scope.text1 );
    
        return {
          restrict: 'E',
          templateUrl: 'assets/templates/directives/label.html'
        };
    
      }
    
    
    } ());
    - - - Aktualisiert - - -

    Wobei so haut es mir meine ganze Seite zusammen - da war doch ein paar Antworten weiter oben schon einmal von dir...eiei

    - - - Aktualisiert - - -

    Jetzt wird hoffentlich langsam ein runder Angular Schuh draus -> das Erstellen vom Canvas Element inkl. Interaktionen werden in einen Service gelegt.

    Wobei mir momentan nicht so recht klar ist wo in Angular die Display-related-Logic aufhört und wo die Business-Logic anfängt.
    Geändert von alphakanal (28-12-2016 um 19:45 Uhr)
    "640 Kilobyte ought to be enough for anybody."
    Bill Gates, 1981

  11. #26
    Avatar von alphakanal
    alphakanal ist offline Foren As
    registriert
    03-12-2016
    Beiträge
    92

    AW: Frage zu EJS Template Engine

    Hab es nun mittlerweile soweit zum laufen gebracht. JUHUU!

    Hier das Demo: My AngularJS App

    Jetzt hab ich nur folgendes Problem:

    Wenn ich meine Seite das erste mal aufrufe funktioniert alles wie gewollt -> Text eingeben -> diesen dann im Canvas anzeigen.
    Wenn ich nun eine andere View aufrufe und zur Startseite zurück gehe, ist der Canvas-Inhalt verschwunden.
    Wenn ich die Seite neu lade ist wieder da.


    Das Canvas Element wird in labelService.js initiert und befüllt ...möchte hier jetzt nicht alles mit unnötig Code vollpumpen.

    Wenn jemand eine Ahnung woran das liegen könnte oder mehr Code/Infos dazu braucht -> bitte sagen was nötig ist dann post ich den Code natürlich sofort :-)


    Update: Gelöst :-)
    Geändert von alphakanal (30-12-2016 um 01:00 Uhr)
    "640 Kilobyte ought to be enough for anybody."
    Bill Gates, 1981

Seite 2 von 2 ErsteErste 12

Ähnliche Themen

  1. css Selector Engine
    Von cybersound im Forum CSS und (X)HTML
    Antworten: 3
    Letzter Beitrag: 02-04-2009, 15:00
  2. Ajax Engine
    Von ray_ray im Forum Serverseitige Programmierung
    Antworten: 2
    Letzter Beitrag: 24-08-2006, 10:17
  3. [PHP/MYSQL] Template Engine
    Von sileo im Forum Script-Check
    Antworten: 1
    Letzter Beitrag: 10-11-2005, 03:05
  4. [php] schnelle template-engine gesucht
    Von rasputin im Forum Serverseitige Programmierung
    Antworten: 5
    Letzter Beitrag: 09-08-2004, 22:22
  5. Search Engine
    Von Marc im Forum Serverseitige Programmierung
    Antworten: 1
    Letzter Beitrag: 29-09-2000, 10:58

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •