javascript angularjs 中的 ng-else 指令
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29840145/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ng-else directive in angularjs
提问by Ramesh Rajendran
how can we create ngELSEdirective as same as ngIFdirective?
我们如何创建与ngELSE指令相同的ngIF指令？
below code for ngIfDirective. Shall we customize the code for ngELSE?
下面的代码ngIfDirective。我们应该自定义代码ngELSE吗？
var ngIfDirective = ['$animate', function($animate) {
return {
multiElement: true,
transclude: 'element',
priority: 600,
terminal: true,
restrict: 'A',
$$tlb: true,
link: function($scope, $element, $attr, ctrl, $transclude) {
var block, childScope, previousElements;
$scope.$watch($attr.ngIf, function ngIfWatchAction(value) {
if (value) {
if (!childScope) {
$transclude(function(clone, newScope) {
childScope = newScope;
clone[clone.length++] = document.createComment(' end ngIf: ' + $attr.ngIf + ' ');
// Note: We only need the first/last node of the cloned nodes.
// However, we need to keep the reference to the jqlite wrapper as it might be changed later
// by a directive with templateUrl when its template arrives.
block = {
clone: clone
};
$animate.enter(clone, $element.parent(), $element);
});
}
} else {
if (previousElements) {
previousElements.remove();
previousElements = null;
}
if (childScope) {
childScope.$destroy();
childScope = null;
}
if (block) {
previousElements = getBlockNodes(block.clone);
$animate.leave(previousElements).then(function() {
previousElements = null;
});
block = null;
}
}
});
}
};
}];
采纳答案by Nidhish Krishnan
Normally we use like this
通常我们这样使用
normal if-else
正常的if-else
if(video == video.large){
<!-- code to render a large video block-->
}
else{
<!-- code to render the regular video block -->
}
AngularJS ng-if
AngularJS ng-if
<div ng-if="video == video.large">
<!-- code to render a large video block-->
</div>
<div ng-if="video != video.large">
<!-- code to render the regular video block -->
</div>
But if you are too specific that you want a directive like ng-if, ng-else-if, and ng-elsethen use ng-elif
但是如果你太具体以至于想要一个像ng-if,的指令ng-else-if，ng-else然后使用ng-elif
<div ng-if="someCondition">
...
</div>
<p>
Some random junk in the middle.
</p>
<div ng-else-if="someOther && condition">
...
</div>
<div ng-else-if="moreConditions">
...
</div>
<div ng-else>
...
</div>
回答by thomaux
En else statement wouldn't make much sense on its own.
En else 语句本身没有多大意义。
You can mimick an elsestatement in 2 ways with vanilla AngularJS
您可以else使用 vanilla AngularJS 以两种方式模仿语句
1. Simply use the negated check in a second ng-if
1. 只需在第二个 ng-if 中使用否定检查
<div ng-if='myConditionIsTrue'></div>
<div ng-if='!myConditionIsTrue'></div>
2. use the ngSwitch directive
2. 使用 ngSwitch 指令
<div ng-switch="myCondition">
<div ng-switch-when="true"></div>
<div ng-switch-default></div>
</div>
回答by Reena
In this it has explained how you could use the ng-else through ng-elif
在本文中，它解释了如何通过 ng-elif 使用 ng-else
Example:
例子：
<div ng-if="someTest" ng-then="theTestPassed">
Some things that assume that "someTest" is true.
</div>
<div ng-else="theTestPassed">
Some other things that assume that "someTest" is false.
</div>
http://zachsnow.com/#!/blog/2014/angularjs-ng-elif/
http://zachsnow.com/#!/blog/2014/angularjs-ng-elif/
Also see this: http://plnkr.co/edit/XSPP3jZL8eehu9G750ME?p=preview
回答by J-Dizzle
Do this, its the reverse of ng-if. Simply saying !(NOT) Value has the same effect as ng-else would. There are ng-else-if (called ng-elif) directives as well, if that's more what you're looking for.
这样做，它与ng-if相反。简单地说!(NOT) Value 与 ng-else 具有相同的效果。也有 ng-else-if （称为ng-elif）指令，如果这更符合您的要求。
<div ng-controller="myCtrl as ctrl">
<div ng-if="ctrl.isTrue">If</div>
<div ng-if="!ctrl.isTrue">If</div>
</div>
Though there is literally no point to creating an ng-else directive when you can simply negate the checked value in ng-if, you can modify the ng-if directive like so to achieve the exact same thing
虽然当您可以简单地否定 ng-if 中的检查值时，创建 ng-else 指令实际上没有意义，但您可以像这样修改 ng-if 指令以实现完全相同的目的
$scope.$watch($attr.ngIf, function ngIfWatchAction(value) {
if (!value) { // add the ! here instead and name this new directive ngElse
