Question

<div class="form-group" ng-if="firstname">
    <label>First Name</label>
    <input readonly type="text" class="form-control" id="first_name" ng-model="firstname" placeholder="First Name">
    <a href="" data-toggle="popover" data-placement="bottom" data-trigger="focus" data-content="User Name" class="glyphicon glyphicon-info-sign infottp"></a>
</div>

我正在使用上面的代码。从我通过点击-info-sign glyphicon显示一个popover，我使用ng-if条件显示/隐藏而不是ng-show和ng-hide。我的问题是当我使用ng-if时，popover不工作。但是弹出器在ng-hide条件下工作，如果我删除ng-if条件。我的问题是为什么popover不能在ng-if条件下工作。

Answer 1

疑难杂症！是，ng-if阻止呈现DOM元素，而ng-show / ng-hide仅更改display css-poperty

请参阅角色文件的第一段ng-if

Answer 2

以下是说明ng-if如何工作的示例

var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
  $scope.firstname = "Test Data";
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body>
  <div ng-app="myApp" ng-controller="customersCtrl">
    <div ng-if="lastname"></div>
    <div class="form-group" ng-if="firstname">
      <label>First Name</label>
      <input readonly type="text" class="form-control" id="first_name" ng-model="firstname" placeholder="First Name">
      <label>Last Name</label>
      <input readonly type="text" class="form-control" id="last_name" ng-model="lastname" placeholder="Last Name">
    </div>
  </div>
</body>

角度ng-if如果引导弹出不起作用

2 个答案: