Ribuan cara menguliti kucing ini. Saya sadar Anda bertanya tentang antara {{}} secara khusus, tetapi untuk orang lain yang datang ke sini, saya pikir ada baiknya menampilkan beberapa opsi lain.
berfungsi pada $ scope Anda (IMO, ini adalah taruhan terbaik Anda di sebagian besar skenario):
app.controller('MyCtrl', function($scope) {
$scope.foo = 1;
$scope.showSomething = function(input) {
return input == 1 ? 'Foo' : 'Bar';
};
});
<span>{{showSomething(foo)}}</span>
ng-show dan ng-hide tentu saja:
<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 kustom seperti yang disarankan Bertrand. (ini adalah pilihan terbaik Anda jika Anda harus melakukan hal yang sama berulang kali)
app.filter('myFilter', function() {
return function(input) {
return input == 1 ? 'Foo' : 'Bar';
}
}
{{foo | myFilter}}
Atau arahan khusus:
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>
Secara pribadi, dalam kebanyakan kasus saya akan pergi dengan fungsi pada lingkup saya, itu membuat markup cukup bersih, dan itu cepat dan mudah diimplementasikan. Kecuali, jika demikian, Anda akan melakukan hal yang persis sama berulang kali, dalam hal ini saya akan pergi dengan saran Bertrand dan membuat filter atau mungkin arahan, tergantung pada situasinya.
Seperti biasa, hal terpenting adalah solusi Anda mudah dipelihara , dan mudah-mudahan dapat diuji. Dan itu akan bergantung sepenuhnya pada situasi spesifik Anda.