この猫の皮をむくための何千もの方法。{{}}の間で具体的に質問していることは承知していますが、ここに来る他の人にとっては、他のいくつかのオプションを示す価値があると思います。
$ scopeの関数(IMO、これはほとんどのシナリオで最善の策です):
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>
Bertrandが提案したカスタムフィルター。(同じことを何度も繰り返す必要がある場合は、これが最良の選択です)
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の提案に従って、状況に応じてフィルターまたはディレクティブを作成します。
いつものように、最も重要なことは、ソリューションが保守しやすく、うまくいけばテスト可能であることです。そして、それはあなたの特定の状況に完全に依存します。