Form nesnesi AngularJS kalıcı iletişim denetleyicisi tanımlanmamış

SORU

11 EKİM 2013, Cuma

Form nesnesi AngularJS kalıcı iletişim denetleyicisi tanımlanmamış

Aşağıdaki gibi bir form ile kalıcı bir iletişim kutusu açar sayfa var. Form eylemi işlemesi gereken denetleyicisi geldiğimizde ancak, form nesnesi tanımlı değil ve neden anlamak için Köşeli bir acemi çok istiyorum

Bu sayfa denetleyicisi kalıcı iletişim kutusunu açmak için bir işlev içerir üst:

app.controller('organisationStructureController', ['$scope', ..., '$modal', function ($scope, ..., $modal) {

    $scope.openInvitationDialog = function (targetOrganisationId) {
      $modal.open({
          templateUrl: 'send-invitation.html',
          controller: 'sendInvitationController',
          resolve: {$targetOrganisationId: function () {
            return targetOrganisationId;
          }
          }
        }
      );
    };

bir sayfa böyle:

// inside a loop over organisations
<a ng-click="openInvitationDialog({{organisation.id}})">Invite new member</a>

davetiye-iletişim html bu gibi görünüyor:

    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <!-- ... -->
            </div>
            <div class="modal-body">
                <form name="invitationForm">

                    <div class="form-group">
                        <label for="email" style="color:white;">Email</label>
                        <input type="email" class="form-control"  autocomplete="off" placeholder="New member email" id="email" name="email" ng-model="invitation.email" required="true"/>
                        <span class="error animated fadeIn" ng-show="invitationForm.email.$dirty && invitationForm.email.$error.required">Please enter an email address!</span>
                        <span class="error animated fadeIn" ng-show="invitationForm.email.$error.email">Invalid email</span>
                    </div>

                    <!-- ... -->

                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" ng-click="cancel()">Cancel</button>
                        <button type="submit" class="btn btn-primary" ng-click="sendInvitation()">Invite</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

Davetiye işlemesi gereken kumanda başka yerde

  app.controller('sendInvitationController', ['$targetOrganisationId', '$scope', ...,
    function ($targetOrganisationId, $scope, ...) {

    $scope.invitation = {
      // ...
      targetOrganisation: {
        id: $targetOrganisationId
      }
    };

    $scope.sendInvitation = function () {

      // $scope.invitationForm is undefined
      if ($scope.invitationForm.$invalid) {
        return false;
      }

      // send the invitation...

    };
  }]);

Kumandaya formu kapsamına almak için doğru yolu nedir?

Belki sendInvitationController $modal sok sendInvitation fonksiyon eklemeliyim? Ama ben ne zaman oyun hiç denetleyicisi girer. Veya kontrolör referans almak yerine $modal.open({ ... gönderme eylemi gerçekleştiren işlev eklemek zorunda mıyım? Çok kendi dosya ve kapsamı içinde sendİnvitationController olmasını tercih ederdim ama.

Herhangi bir yardım için teşekkür ederiz!

EDİT

Bize geçici bir çözüm oluşturmanıza yardımcı olan birkaç şey bulduk ve birisi soruya kendisi cevap yardımcı olabilir:

$scope.invitation nesne $scope.invitationForm tanımsız kalır sendInvitationController tanımsız değildir ama doğru veri tutar.
$scope.invitationForm.$invalid erişim ve doğrulama orada yapabiliriz send-invitation.html içinde: <button type="button" ng-click="sendInvitation()" ng-disabled="invitationForm.$invalid">Invite</button>

Soru şu: neden $scope invitationForm nesne bağlama form model correcetly bağlar submit başarısız mı?

CEVAP

12 Kasım 2013, Salı

Ben de aynı sorun vardı ve modellerimiz denetleyicisi kapsamında form nesnesi tanımlayarak çözebilir. Kodunuz çalışma almak için kumandanız başında, örneğin, $scope.form = {}; <form name="form.invitation"> form etiketi değiştirin. Daha sonra $scope.form.invitation.$invalid doldurulmalıdır.

Bunu Paylaş: