9

Problem polega na tym, że używam interfejsu użytkownika i mam dwa widoki, jeden jest rodzajem paska narzędzi, drugi jest wypełniony formularzem.Angular.js - czy walidacja formularza powoduje emisję?

Teraz chciałbym mieć przycisk Zapisz na pasku narzędzi, który byłby wyłączony, gdyby formularz nie był $valid. Ale te dwa są na całkowicie różnych zakresów, to jak:

  • rootScope
    • zakres Pasek
    • zakres zawartości (z form.$valid)

Więc myślałem, że poradzić sobie z tym słuchając pewnych ważnych wydarzeń emitowanych przez formularz.

Zgodnie z tym co powiedział Vojta here te wydarzenia powinny istnieć, ale nie mogę znaleźć nigdzie im określony .. i patrząc na this nie widzę żadnych wydarzeń ..

pewnie mógłby zrobić

$scope.$watch('form.$valid', function(newVal, oldVal) { 
    $scope.$emit('validityChange', {'form':newVal}); 
}); 

ale czuje się jak za pomocą zdarzenia, zamiast tego byłoby lepiej

może powinienem spróbować czegoś zupełnie innego? Zauważ, że nie mogę umieścić interfejsu ui-view paska narzędzi w widoku ui treści .. i zgodnie z this, dwa widoki ui po prostu nie mogą mieć tego samego zakresu.

Odpowiedz

0

Aby odpowiedzieć bezpośrednio na pytanie: Nie mam informacji o zdarzeniach natywnych w angularjs. Ale, jak wiesz, możesz łatwo tworzyć własne wydarzenia, które rozwiążą Twój problem.

Ale tutaj jest moja sugestia: Próbujesz uczynić dwóch kontrolerów komunikować się ze sobą. Używanie zdarzeń może być niewłaściwym podejściem. Zdarzenia powinny być rzeczywiście używane do powiadomień o szerokim zakresie aplikacji, takich jak uwierzytelnianie.

Możesz przekształcić formularz i przesłać przycisk w dwie dyrektywy, które współdzielą ten sam kontroler. Chociaż nie udostępnią zakresu, udostępnią obiekt kontrolera, który może być używany do komunikacji. Zrobiłbym to w ten sposób.

Innym podejściem jest zagnieżdżanie dwóch zakresów w siebie. Przenieś kod formularza do kontrolera wyższego poziomu. Tak:

  • rootScope
    • główny kod // Twój formularz tutaj
      • Pasek // przycisk submit ma dostęp do funkcjonalności
      • zawartość // forma ma dostęp do funkcjonalności

Nadzieja, która pomaga!

+0

Czy ta odpowiedź nie jest odpowiedni? –

0

Zakładając, że oba widoki muszą mieć różne stany i oba znajdują się na tym samym głównym kontrolerze i głównej stronie HTML, można użyć ich nazw stanu wraz z ng-if, aby określić swój stan.

Powiedzmy "zawartość" stan jest dla widoku zawartości.

Teraz w HTML div tagu, który zawiera pasek narzędzi, wspominając warunku coś w przycisk Zapisz dziedzinie, podobną do tej, tj

ng-if = $state.current.name === 'content' && 'nameOfYourForm'.$valid 

Jeżeli warunek ten jest spełniony, to znaczy pośrednio Twoja forma jest ważna .

Należy jednak napisać to w metodzie run, która powinna zostać zadeklarowana w tym samym pliku js, co deklaracja modułu viz.

angular.module('nameOfModule' , ['dependency1', ..]). run(run) 

A następnie w metodzie run, wstrzyknąć $ rootScope i $ stan i zadeklarować i zdefiniować ją tak:

function run(stateHandler, .. ,$rootScope, $state) { 
    $rootScope.$state = $state; 
}