Zajmuję się moim problemem w ten sposób:
ng-style="{ width: getTheValue() }"
Ale aby uniknąć tej funkcji po stronie kontrolera, wolałbym zrobić coś takiego:
ng-style="{ width: myObject.value == 'ok' ? '100%' : '0%' }"
W jaki sposób mogę to zrobić?
angularjs
angularjs-directive
TigrouMeow
źródło
źródło
Odpowiedzi:
Jak powiedział @Yoshi, z kątownika 1.1.5 możesz go używać bez żadnych zmian.
Jeśli używasz kąta <1.1.5, możesz użyć klasy ng .
źródło
prosty przykład:
{„kolor tła”: „zielony”} POWRÓT true
LUB ten sam wynik:
inna możliwość warunkowa:
źródło
isTrue
a{'background-color':'green'}
LUB sprawdzi tylkoisTrue
i pokaże,background
jak będzie działać, proszę wyjaśnić komukolwiek?Możesz to osiągnąć w następujący sposób:
źródło
@ jfredsilva ma oczywiście najprostszą odpowiedź na pytanie:
Jednak naprawdę możesz rozważyć moją odpowiedź na coś bardziej złożonego.
Przykład trójskładnikowy:
Coś bardziej złożonego:
Jeśli
$scope.color == 'blueish'
kolor będzie „niebieski”.Jeśli
$scope.zoom == 2
rozmiar czcionki to 26 pikseli.źródło
{<value>:'<string>'}[<$scope.var>]}
, skąd pochodzi?jeśli chcesz używać wyrażenia, sztywny sposób to:
ale najlepszym sposobem jest użycie klasy ng
źródło
Syntax Error: Token '%3A' is%20an%20unexpected%20token at column 9 of the expression [ng-style%3A%
...Ogólnie można użyć kombinacji
ng-if
ing-style
uwzględnić zmiany warunkowe wraz ze zmianą obrazu tła.źródło
Uncaught Error: Template parse errors: Can't bind to 'ng-style' since it isn't a known property of 'div'
błądDla pojedynczej właściwości css
W przypadku wielu właściwości css można odwołać się poniżej
Zamień 1 == 1 na wyrażenie warunkowe
źródło
działa również ta składnia dla operatora trójskładnikowego:
gdzie
<value>
są wartości właściwości $ scope. W przykładzie:``
pozwala to na pewne obliczenia wartości właściwości css.
źródło
Robię jak poniżej dla wielu niezależnych warunków i działa jak urok:
źródło
Używam klasy ng do dodawania stylu: -
Użycie operatora trójskładnikowego wraz z dyrektywami klasy ng w angular.js do nadania stylu. Następnie określ styl klasy w pliku .css lub .scss . Np .: -
źródło
Nie jestem pewien, jak to działa dla was, ale w Angular 9 muszę owinąć ngStyle w nawiasy:
W przeciwnym razie to nie działa
źródło