Question

带有angular-formly的默认隐藏指令是ng-if，可以通过例如formlyConfigProvider。

目前我的所有字段都应该始终显示，我不想要不必要的ng-if =＆＃34;！field.hide＆＃34;提交的检查可能会影响性能。

我如何能够形式地告诉每个字段/表格或全局使用此检查？

Answer 1

ng-if如果要添加和删除DOM中的元素，当您想要显示和隐藏大量元素时，它可能会很慢，您可以使用ng-show。 ng-show只会改变元素的可见性。

＆＃13;

<html lang="en" itemscope="" itemtype="http://schema.org/Article">
  <head>
    <script>
      var oModelesDep = [];
    </script>  

    <!-- Angular Material requires Angular.js Libraries -->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script>
    <script src="https://s3.amazonaws.com/gowpres/resources/js/utils/jquery-1.10.2.js"></script>

    <!-- Angular Material Library -->
    <script src="https://www.weldpad.com/starterkit.js?containerId=60515"></script> 

    <script data-meta="61021" src="https://www.weldpad.com/sogettopanswerers.html?containerId=61021"></script>            
  
                
  </head>
  <body ng-controller="AppCtrl" ng-app="MyApp">
    <h4 ng-init="showchat = true">Your - Starter Kit</h4>
    <button ng-click="showchat = false">hide</button>
    <button ng-click="showchat = true">show</button>

    {{showchat}}

    <sogettopanswerers ng-show="showchat" tag="html">
      <div ng-repeat="qdata in listqdata.items track by $index" style="background-color: white;">

        <div class="well" style="overflow: auto;">
          <h2>
            <a href="{{qdata.link}}" class="question-hyperlink">

              {{qdata.title}}
            </a>

            <small>{{qdata.view_count}} Views</small></h2>

          <contentashtml ng-init="load()" content="qdata.body">
          </contentashtml>

          <div style="padding:15px;display: inline-block;vertical-align: top;">
            <p>Name: {{qdata.owner.display_name}}</p>

            <a href="{{qdata.owner.link}}">
              <img ng-src="{{qdata.owner.profile_image}}" alt="Description"/>
            </a>
          </div>
          <div style="display: inline-block;">
            <p>Created: <span am-time-ago="qdata.creation_date * 1000"></span></p>
            <p>
              Last Update:<span am-time-ago="qdata.last_activity_date * 1000"></span>
            </p>
            <p>
              Answered:{{qdata.is_answered}}
            </p>
          </div>
          <p>
            Answers:{{qdata.answer_count}}
          </p>

        </div>

      </div>
    </sogettopanswerers>    

  
  </body>
</html>

＆＃13;

看看这一行：

<sogettopanswerers ng-show="showchat" tag="html">

并查看响应速度有多快。

Answer 2

您以形式

设置hide-directive="ng-show"

<formly-form    hide-directive="ng-show"></formly-form>

“的隐藏-指令

允许您控制用于隐藏字段的指令。这个的共同价值可能是ng-show。它将被传递！field.hide。您也可以使用formlyConfig.extras.defaultHideDirective ='ng-show'“
在全局级别指定此项。
http://docs.angular-formly.com/docs/formly-form

因此您可以按照我的指示进行设置，也可以选择在启动时为所有字段编辑配置

以角度形式禁用field.hide

2 个答案: