[解決済み】angular JSのダブルカーリーブレースとシングルカーリーブレースの違い？

質問

私はangularの世界に入ったばかりですが、二重中括弧{{}}の使い方に少し戸惑っています。 ディレクティブのように、中括弧を使わずに式を含めることもあります。

1. ng-class={expression}
2. normal data binding like{{obj.key}}
3. ng-hide='mydata==="red"'

解決方法は？

{{}} - 二重中括弧

{{}} はAngularの式で、HTMLに何かを書きたいときにとても便利です。

<div>
    {{planet.name == "Earth" ? "Yeah! We 're home!" : "Eh! Where 're we?"}}
</div>

<!-- with some directives like `ngSrc` -->
<img ng-src="http://www.example.com/gallery/{{hash}}"/>

<!-- set the title attribute -->
<div ng-attr-title="{{celebrity.name}}">...

<!-- set a custom attribute for your custom directive -->
<div custom-directive custom-attr="{{pizza.size}}"></div>

すでに式になっている場所でこれらを使わないでください!

例えば、ディレクティブ ngClick は、引用符の間に書かれたものを式として扱います。

<!-- so dont do this! -->
<!-- <button ng-click="activate({{item}})">... -->  

{中括弧は1つです。

{} はJavaScriptのオブジェクトの略であることはご存知の通りです。ここでも、何も変わりません。

<div ng-init="distanceWalked = {mon:2, tue:2.5, wed:0.8, thu:3, fri:1.5, 
sat:2, sun:3}">

のようないくつかのディレクティブで ngClass または ngStyle マップを受け入れることができます。

<span ng-style="{'color' : 'red'}">{{viruses.length}} viruses found!</span>

<div ng-class="{'green' : vegetable == 'lettuce', 
'red' : vegetable == 'tomato'}">..

中括弧なし。

すでに述べたように、表現の内側ではブレイクスルーすればいいのです。実にシンプルだ。

<div ng-if="zoo.enclosure.inmatesCount == 0">
    Alarm! All the monkeys have escaped!
</div>