Question

我有几个容器根据范围属性显示文本：

<style>
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak{
    display: none !important;
}
</style>
<a ng-hide="show===false" ng-cloak>item 1</a>
<a ng-hide="show===true"  ng-cloak>item 2</a>
<span ng-click="toggle()">toggle</span> 
//js
var app = angular.module('appy', []);
app.controller('ctrl', function($scope){
  $scope.show = false;
  $scope.toggle = function(){
    $scope.show = !$scope.show;
  };
});

https://jsbin.com/numaxiroka/edit?html,js,output

这个简单的例子在JSBIN中起作用，但在我的页面上的内容＆＃34;第1和第3项;和＆＃34;项目2＆＃34;两者都在屏幕上瞬间闪烁。我可能做错了什么会使两个元素短暂出现？

我一直在使用this作为参考。

Answer 1

我建议您做的第一件事就是将ng-cloak放在body而不是每个锚点上。这样有助于隐藏angular uncompiled内容（{{}}）以显示在身体内部的任何位置。

如果您只是想展示主播，那么我说要使用 ng-bind 来呈现内部文字，如下所示

<强>标记

<a ng-bind="show? 'item 1' : 'item 2'" href="{{myHref(show)}}"></a>

<强>代码

$scope.myHref = function(){
   if(show) 
      return 'something/someaction1' 
   else 
      return 'something/someaction2' ;
}

两个带有ngHide的切换元素暂时闪烁在屏幕上

1 个答案: