2015-05-08 15 views
6

W zgłoszeniu Material Design mdDialog documentation zauważyłem, że minął zakres (bez przedrostka z dolara) do DialogController w dolnej części.

(function(angular, undefined){ 
    "use strict"; 
    angular 
    .module('demoApp', ['ngMaterial']) 
    .controller('AppCtrl', AppController); 
    function AppController($scope, $mdDialog) { 
    var alert; 
    $scope.showAlert = showAlert; 
    $scope.showDialog = showDialog; 
    $scope.items = [1, 2, 3]; 
    // Internal method 
    function showAlert() { 
     alert = $mdDialog.alert({ 
     title: 'Attention', 
     content: 'This is an example of how easy dialogs can be!', 
     ok: 'Close' 
     }); 
     $mdDialog 
     .show(alert) 
     .finally(function() { 
      alert = undefined; 
     }); 
    } 
    function showDialog($event) { 
     var parentEl = angular.element(document.body); 
     $mdDialog.show({ 
     parent: parentEl, 
     targetEvent: $event, 
     template: 
      '<md-dialog aria-label="List dialog">' + 
      ' <md-dialog-content>'+ 
      ' <md-list>'+ 
      '  <md-list-item ng-repeat="item in items">'+ 
      '  <p>Number {{item}}</p>' + 
      '  '+ 
      ' </md-list-item></md-list>'+ 
      ' </md-dialog-content>' + 
      ' <div class="md-actions">' + 
      ' <md-button ng-click="closeDialog()" class="md-primary">' + 
      '  Close Dialog' + 
      ' </md-button>' + 
      ' </div>' + 
      '</md-dialog>', 
     locals: { 
      items: $scope.items 
     }, 
     controller: DialogController 
     }); 
     function DialogController(scope, $mdDialog, items) { 
     scope.items = items; 
     scope.closeDialog = function() { 
      $mdDialog.hide(); 
     } 
     } 
    } 
})(angular); 

Czytałem, że $ jest konwencją nazewnictwa i dobry sposób, aby zmienne pewien, że nie dostają nadpisane. Dlaczego ten kod nie stosuje się do tej konwencji? Czy w tym kontekście, skąd wiemy, kiedy używać $, czy nie, i jakie jest znaczenie? Wierzę, że w tym przypadku musi to być coś więcej niż konwencja nazewnicza, lub autorzy zdecydowaliby się użyć $scope dla celów spójności.

UWAGA: zdaję sobie sprawę z różnicy między $scope i scope w funkcjach łączenia, gdzie scope wskazuje stały zestaw parametrów. Nie sądzę, że dlatego w tym kontekście użyto scope, ale daj mi znać, jeśli się mylę.

Dzięki!

+2

To prawda @Freelancer. Funkcja DialogController jest normalną funkcją, a nie regulatorem kątowym lub regulatorem kątowym. zakres to tylko nazwa nadana temu argumentowi. To nie jest wstrzykiwany zakres $. –

+1

Dzięki za spostrzeżenia-Chociaż jest wymieniony jako kontroler za pośrednictwem $ mdDialog.show ({controller: DialogController}); ? –

+1

I, erm, jeśli to nie jest kontroler - co dokładnie robi? :-) Dzięki. –

Odpowiedz

5

Myślę, że dokumenty są tu niespójne - jednocześnie poprawne w tym samym czasie.

Tutaj będą takie same ustawienia, ale ja tylko to rozgryzłem po przeczytaniu kodu źródłowego. Linia winowajców znajduje się wewnątrz InterimElement, gdzie locals są rozszerzone o options, które z kolei mają właściwość scope.

return showDone = compilePromise.then(function(compileData) { 
       angular.extend(compileData.locals, self.options); 

       element = compileData.link(options.scope); 

jestem całkiem pewny, że posiadanie $scope dostępną jako scope jest tylko incydent i utrzymać wszystko czyste jeden powinien używać $scope odnieść się do wartości dostarczonego przez $injector jak to jest w sterownikach.

Przesłałem a pull request, aby naprawić niespójność i skompilowałem a pen demonstrating the usage.

+2

Skała. Wielkie dzięki! Miałem mnóstwo kłopotów, owijając moją głowę wokół tego. –

0

To nie jest porażka w stosunku do konwencji, nawet brak urywka, aby użyć modala.

Używanie scope, a nie $scope, to unikanie zastępowania zmiennych wewnątrz funkcji zagnieżdżonej.

Wybór umieszczenia scope bez znaku dolarowego, aby uniknąć błędów, dla których otrzyma ten fragment.

Rozdzielanie elementów za pomocą składni Controller as może pomóc w wyjaśnieniu.

Powiązane problemy