Eğik

Question

Kodum sahiptir yapısı aşağıdaki gibidir:

1. main.html - yükler tüm modülleri - div etiketi-yük div
2. file1.html içerir - ng-app ve ana kontrolör beyan ... (diğer tüm html dosyaları) - file3.html demek sadece <div>/çocuk etiketleri içeren ve böyle bir dosyada

şimdi böyle tıklama olarak olaylara main.html olan bir yük div içine yüklenir Bir onay kutum var. Bu onay kutusunun onclick Bir modal penceresini açmak istiyorum - sunulacak bir form. Şimdi burada

file3.html kodum şimdi main.hml

$scope.showModal = false; 
    $scope.toggleModal = function(){ 
    $scope.showModal = !$scope.showModal; 
}; 

benim dosya3 olduğunda beklenen davranıştır beyan esas ana denetleyici kodu follwing yazdım

<div> 
     <input type="checkbox" name="your-group" value="unit-in-group" onclick="toggleModal();"/>Unit-in-group 
     <modal title="some title" visible="showModal"> 
      <form role="form"> 
       <div class="form-group"> 
        <label for="email">Email address</label> 
        <input type="email" class="form-control" id="email" placeholder="Enter email" /> 
       </div> 
       <div class="form-group"> 
        <label for="password">Password</label> 
        <input type="password" class="form-control" id="password" placeholder="Password" /> 
       </div> 
       <button type="submit" class="btn btn-default">Submit</button> 
      </form> 
     </modal> 
    </div> 

olduğunu yüklü bir onay kutusu ekranda göreceksiniz ve ben tıklattığımda, bir modal penceresi açacaktır ama bunun yerine ben gördüğüm aynı sayfada modal form alanları görüyorum. ve tıkladığımda showModal'ın tanımlanmadığı açısal bir istisna alıyorum.

Neredeler?

Answer 1

Yalnızca açısal sözdizimini kullanmanız yeterlidir: ng-click için bu görünüm ve ng-show görünürlüğü için.

<input type="checkbox" name="your-group" value="unit-in-group" ng-click="toggleModal();"/>Unit-in-group 
<modal title="some title" ng-show="showModal"> 

Diğer seçenekler:

Ayrıca bu durumda pek fark olmaz yerine ng-click ait ng-change, kullanabilirsiniz.

Ya da ng-model (ng-model="showModal") işlevini kullanabilir ve geçiş işlevinizden tamamen sıfırlayabilirsiniz Example.

Answer 2

başka bir yaklaşım onay kutusunun işaretli var olduğunu tespit etmek için ngChange directive kullanmak olacaktır

modal için

<input type="checkbox" name="your-group" value="unit-in-group" ng-change="toggleModal();"/> 

Kod diğer bir cevap olarak aynı

<modal title="some title" ng-show="showModal"> 

önerdi kalır