0

将引导模式与我的角度形式一起使用。我可以在取消/添加函数中传回模型,因为它们在范围内,但覆盖背景 div 在外部。单击叠加层时如何传回对象?

HTML

<div id="add-contact" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" data-ng-model="itemInEditMode" data-ng-click="cancelAdd(itemInEditMode)">×</button>
    <h3>Add new contact</h3>
  </div>

  <div class="modal-body">

    <form class="form-horizontal add-inventory-item" ui-if="itemInEditMode != null">

            <div class="left-align-form">

                <div class="left-field span3">
                    <label for="">Full Name</label>
                    <input type="text" name="" id="" data-ng-model="itemInEditMode.fullName">
                </div>

                <div class="left-field span3">
                    <label for="">Position</label>
                    <input type="text" name="" id="" data-ng-model="itemInEditMode.position">
                </div>
                <div class="clear"></div>
            </div>

            <div class="left-align-form">

                <div class="left-field span2">
                    <label for="">Phone Number</label>
                    <input type="text" name="" id="" data-ng-model="itemInEditMode.mainPhoneNumber">
                </div>

                <div class="left-field span2">
                    <label for="">Mobile Number</label>
                    <input type="text" name="" id="" data-ng-model="itemInEditMode.mobilePhoneNumber">
                </div>

                <div class="left-field span2">
                    <label for="">Fax Number</label>
                    <input type="text" name="" id="" data-ng-model="itemInEditMode.faxNumber">
                </div>
                <div class="clear"></div>
            </div>

            <div class="span3">
                <label for="">Email Address</label>
                <input type="text" name="" id="" data-ng-model="itemInEditMode.email">
            </div>
            <div class="clear"></div>            

            <div class="left-align-form checkbox-group">

                <div class="left-field span1">
                    <label for="">Primary Contact</label>
                    <input type="checkbox" id="" data-ng-model="itemInEditMode.primaryContact" data-ng-checked="itemInEditMode.primaryContact">
                </div>

                <div class="left-field span1">
                    <label for="">Event Notifications</label>
                    <input type="checkbox" name="" id="" data-ng-model="itemInEditMode.eventNotifications">
                </div>

                <div class="left-field span1">
                    <label for="">Billing Notifications</label>
                    <input type="checkbox" name="" id="" data-ng-model="itemInEditMode.billingNotifications">
                </div>

                <div class="left-field span1">
                    <label for="">SMS Notifications</label>
                    <input type="checkbox" name="" id="" data-ng-model="itemInEditMode.smsNotifications">
                </div>

                <div class="clear"></div>
            </div>            

    </form> 

  </div><!-- end modal-body -->

  <div class="modal-footer">
    <button class="btn fooda-action-green" data-ng-click="saveContact()" data-dismiss="modal"><i class="icon-plus-sign"></i>Add</button>
    <button class="btn fooda-action-orange" data-ng-model="itemInEditMode" data-ng-click="cancelAdd(itemInEditMode)" data-dismiss="modal" aria-hidden="true"><i class="icon-minus-sign"></i>Cancel</button>
  </div>

</div><!-- end add-contact modal -->  

jQuery 函数(用于测试)

$('#add-contact').on('hide', function(itemInEditMode) {
    $scope.cancelAdd(itemInEditMode);   
});

谢谢!

4

0 回答 0