在AngularJS警报上显示ng-show

时间:2013-10-16 14:09:05

标签: javascript twitter-bootstrap angularjs

我正在尝试使用AngularJS显示一些警报,请参阅http://angular-ui.github.io/bootstrap/ - 警报部分。 我想修改示例以仅显示“show”属性设置为true的警报:

  $scope.alerts = [
    { type: 'error', msg: 'Oh snap! Change a few things up and try submitting again.', show: true }, 
    { type: 'success', msg: 'Well done! You successfully read this important alert message.', show: false }
  ];

在警告标记中,我添加了ng-show="alert.show",但它似乎没有显示任何警报。 您可以在此处找到代码:http://plnkr.co/edit/Qbv4A9u1SnQeJy9o81lK?p=preview

我做错了什么?提前谢谢!

1 个答案:

答案 0 :(得分:4)

ng-repeatng-show移至父div。

<div ng-controller="AlertDemoCtrl">
  <div ng-repeat="alert in alerts" ng-show="alert.show">
    <alert type="alert.type" close="closeAlert($index)">{{alert.msg}}</alert>
  </div>
  <button class='btn' ng-click="addAlert()">Add Alert</button>
</div>

ng-show本身就是一个指令,我怀疑它与UI Bootstrap中的alert指令没有合作。

Modified Plunker