Question

我有一个问题。我们的逻辑是显示新用户第一次添加新页面时将显示空内容，因此消息应显示为<p class="no-data">No Datasources to show. Please Create a new DataSource</p>。

它运作正常。但即使用户在加载期间再次单击时已经使用了特定页面，它也会显示相同的消息“无数据源显示。请创建新的数据源”。但是不应该显示我们应该为已经创建的用户隐藏消息。

        <div class="row" [hidden]="listView">
        <!--DATE:May-14-2018  -->
    <!-- start -->
        <div *ngIf="sources.length===0">
            <p class="no-data">No Datasources to show. Please Create a new DataSource</p>
        </div>
        <div *ngIf="sources.length!==0" class="col-lg-12">
        <!--DATE:May-14-2018  -->
    <!-- end -->
        <div class="row">
        <div  *ngFor="let source_info of sources;let i=index " class="col-xl-3 col-lg-6 col-sm-6 col-xs-12">
          <div class="cat__core__step cat__core__step-- mb-4">
            <div  class="row">
            <div  class="col-md-3 col-xl-3 col-lg-3">
              <span  class="cat__core__step__digit">
                <img class="widget-logo"  src="assets/images/data_source_widget_icons/{{source_info.source.vendor}}.png">
              </span><!-- cat__core__step__digit -->
              </div>
              <div class="col-md-9 col-xl-9 col-lg-9">
              <div class="cat__core__step__desc">
                  <span class="cat__core__step__title widget_name">{{source_info.source.name}}</span>
                  <div class="source-category">Category : {{source_info.source.category}}</div>
                    <div class="records">Version : {{source_info.source.version}} </div>

                <button type="button" class="btn btn-outline-danger btn-sm icmn-bin" data-toggle="modal" 
                [attr.data-target]="'#delete_modal_widget_' + source_info.source.name" 
                     (click)="password=''" *ngIf="source_info.source.assigned ===  false"
                        ></button> 

                        <a [routerLink]="['../edit/'+source_info.source.name]" [queryParams]="{'display':source_info.source.category,'category':source_info.source.category,'vendor_name':source_info.source.vendor,'vendor_title':source_info.source.name}">
                            <button type="button" class="btn btn-outline-warning btn-sm icmn-pencil"></button>
                        </a>


                        <a [routerLink]="['../view/'+source_info.source.name]" [queryParams]="{'display':source_info.source.category,'category':source_info.source.category,'vendor_name':source_info.source.vendor,'vendor_title':source_info.source.name}">
                            <button type="button" class="btn btn-outline-success btn-sm icmn-eye"></button>
                        </a>

              </div>

         <!-- cat__core__step__desc -->
              </div>

              <!-- col-md-9 col-xl-9 col-lg-9 -->
          </div><!-- row -->

          </div><!-- cat__core__step-- mb-4 -->     
      </div><!-- ngFor -->

      </div>

      </div>

</div>

Answer 1

根据这一部分：

 <div *ngIf="sources.length===0">
           ...
 </div>

当sources数组为0时显示消息。

你没有提供你的控制逻辑（.ts文件），所以我只能猜出导致这种情况的原因。

也许您每次用户点击时都会重新初始化
也许你在路由上破坏了对象。你在哪里存储这个sources对象？在app.component中，它在里面吗？如果没有，则可能在导航时，使用包含页面的对象销毁该对象。
- 如果是这种情况，请考虑使用a shared service

如果以上都没有帮助，请提供更多（控制逻辑）代码。

如何在html页面加载时隐藏消息？

1 个答案: