inline.js中的内联条件
我想知道是否有一种angular度有条件地显示内容，而不是使用ng-show等。例如在backbone.js我可以做一些内联内容在模板中，如：
<% if (myVar === "two") { %> show this<% } %> 但是在angular度上，我似乎仅限于显示和隐藏包装在html标签中的东西
<p ng-hide="true">I'm hidden</p> <p ng-show="true">I'm shown</p>
什么是angular度推荐的方式来有条件地显示和隐藏内联angular度内容，而不是用html标签包装内容？
编辑： 2Toad的答案下面是你在找什么！ upvote那件事
如果你使用的是Angular <= 1.1.4，那么这个答案将会做到：
还有一个答案。 我发布了一个单独的答案，因为它更像是一个解决scheme的“确切”尝试，而不是一系列可能的解决scheme：
这是一个filter，将做一个“立即如果”（aka iif）：
app.filter('iif', function () { return function(input, trueValue, falseValue) { return input ? trueValue : falseValue; }; });
并可以像这样使用：
{{foo == "bar" | iif : "it's true" : "no, it's not"}}
Angular 1.1.5增加了对三元运算符的支持：
{{myVar === "two" ? "it's true" : "it's false"}}
数以千计的方式来剥皮这只猫。 我意识到你在{{}}之间的问题，但对于其他人来说，我认为值得展示一些其他选项。
函数在你的$范围（国际海事组织，这是在大多数情况下你最好的select）：
app.controller('MyCtrl', function($scope) { $scope.foo = 1; $scope.showSomething = function(input) { return input == 1 ? 'Foo' : 'Bar'; }; }); <span>{{showSomething(foo)}}</span>
ng-show和ng-hide当然是：
<span ng-show="foo == 1">Foo</span><span ng-hide="foo == 1">Bar</span>
ngSwitch
<div ng-switch on="foo"> <span ng-switch-when="1">Foo</span> <span ng-switch-when="2">Bar</span> <span ng-switch-default>What?</span> </div>
一个自定义的filter，如伯特兰build议。 （如果你一次又一次地做同样的事情，这是你最好的select）
app.filter('myFilter', function() { return function(input) { return input == 1 ? 'Foo' : 'Bar'; } } {{foo | myFilter}}
或自定义指令：
app.directive('myDirective', function() { return { restrict: 'E', replace: true, link: function(scope, elem, attrs) { scope.$watch(attrs.value, function(v) { elem.text(v == 1 ? 'Foo': 'Bar'); }); } }; }); <my-directive value="foo"></my-directive>
就个人而言，在大多数情况下，我会在我的范围内使用一个函数，它使标记相当干净，并且实现起来很快捷。 除非你会一遍又一遍地做同样的事情，在这种情况下，我会根据Bertrand的build议，根据具体情况创build一个filter或可能的指令。
与往常一样， 最重要的是您的解决scheme易于维护 ，并且可以进行testing。 这将完全取决于你的具体情况。
当我不能使用ng-class的时候（例如当样式化SVG时），我使用下面的语句来有条件地设置类attr：
ng-attr-class="{{someBoolean && 'class-when-true' || 'class-when-false' }}"
同样的方法应该适用于其他属性types。
（我认为你需要使用最新的不稳定Angular来使用ng-attr-，我目前在1.1.4上）
我发表了一篇关于与AngularJS + SVG合作的文章，谈论这个和相关的问题。 http://www.codeproject.com/Articles/709340/Implementing-a-Flowchart-with-SVG-and-AngularJS
要检查variables内容并使用默认文本，可以使用：
<span>{{myVar || 'Text'}}</span>
如果我理解了你的话，我想你有两种方法可以做到这一点。
首先你可以尝试ngSwitch ，第二种可能的方式是创build你自己的filter 。 可能ngSwitch是正确的方法，但是如果你想要隐藏或显示内嵌内容，只需使用{{}}filter即可。
作为一个例子，这里有一个简单的filter的小提琴 。
<div ng-app="exapleOfFilter"> <div ng-controller="Ctrl"> <input ng-model="greeting" type="greeting"> <br><br> <h1>{{greeting|isHello}}</h1> </div> </div> angular.module('exapleOfFilter', []). filter('isHello', function() { return function(input) { // conditional you want to apply if (input === 'hello') { return input; } return ''; } }); function Ctrl($scope) { $scope.greeting = 'hello'; }
Angular UI库内置了伪指令ui，如果是在模板/视图中的条件ui 1.1.4
示例：支持Angular UI up to ui 1.1.4
<div ui-if="array.length>0"></div>
ng-if在1.1.4之后的所有angular度版本中都可用
<div ng-if="array.length>0"></div>
如果你有数组中的任何数据，那么只有div会出现
即使在异国情况下工作：
<br ng-show="myCondition == true" />
我会把我的混合：
https://gist.github.com/btm1/6802312
这将评估if语句一次，并且不添加监视器监听器，但是您可以向具有该set的元素（如果调用wait-for =“somedata.prop”）添加额外的属性，并且将等待该数据或属性被设置评估if语句一次。 如果您正在等待来自XHR请求的数据，则额外的属性可能非常方便。
angular.module('setIf',[]).directive('setIf',function () { return { transclude: 'element', priority: 1000, terminal: true, restrict: 'A', compile: function (element, attr, linker) { return function (scope, iterStartElement, attr) { if(attr.waitFor) { var wait = scope.$watch(attr.waitFor,function(nv,ov){ if(nv) { build(); wait(); } }); } else { build(); } function build() { iterStartElement[0].doNotMove = true; var expression = attr.setIf; var value = scope.$eval(expression); if (value) { linker(scope, function (clone) { iterStartElement.after(clone); clone.removeAttr('set-if'); clone.removeAttr('wait-for'); }); } } }; } }; });
所以与Angular 1.5.1 （现有的应用程序依赖于一些其他的MEAN堆栈依赖关系是为什么我目前不使用1.6.4）
这对我来说就像OP说{{myVar === "two" ? "it's true" : "it's false"}} {{myVar === "two" ? "it's true" : "it's false"}}
{{vm.StateName === "AA" ? "ALL" : vm.StateName}}
