Question

如果isBannerVisible为true，我有此代码显示警告横幅。但是如果值为false，则横幅仍会呈现几秒钟然后消失。我不知道如何防止这种情况发生。我尝试在它之前添加<div style="display:none" data-bind="visible: true">，并且它不会在isBannerVisible = true或false上显示。

  <div data-requisite="mybiz.businesscenter.infobannercomponent" data-bind="if: shouldInitialize">
    <div class="alert alert-info alert-dismissable" data-bind="visible: isBannerVisible()">
        <button type="button" class="close" data-dismiss="alert" data-bind="click: bannerClose"
                aria-hidden="true">
            &times;
        </button>


JS.....
    var InfoBannerViewModel = function ($el) {
                    var self = this;
                    .....
                    self.isBannerVisible = ko.observable((!dataStore.getItem('isBannerVisible') ? true : dataStore.getItem('isBannerVisible')));
                     .......

            };

            var _init = function ($el) {
                        var infoBannerViewModel = new InfoBannerViewModel($el);
                        app.bind(infoBannerViewModel, $el);
            };

            return {
                init: _init
            };
        });

Answer 1

我同意上面评论中的@super很酷的答案，以下是如何操作的示例：

<div data-requisite="mybiz.businesscenter.infobannercomponent" data-bind="if: shouldInitialize">
   <!-- ko if: isBannerVisible() -->
    <div class="alert alert-info alert-dismissable">
        <button type="button" class="close" data-dismiss="alert" data-bind="click: bannerClose"
                aria-hidden="true">
            &times;
        </button>
     </div>
    <!-- /ko -->
</div>

如何在不可见数据绑定时阻止HTML呈现

1 个答案: