Latest web development tutorials

AngularJS HTML DOM

AngularJSは、アプリケーションデータが属性のHTML DOM要素を結合するための手順を説明します。


ngの禁止命令

ngの禁止命令は、直接HTML disabledプロパティにアプリケーションデータをバインドします。

AngularJS例

<DIV ngのアプリ= "" NG-INIT = "mySwitch =真">

<P>
<ボタンNG-無効= "mySwitch "> 私がポイント!</ボタン>
</ P>

<P>
<入力タイプ= "チェックボックス" NG -model = "mySwitch">ボタン
</ P>

<P>
{{MySwitch}}
</ P>

</ DIV>

»をお試しください

説明する例:

ngの禁止命令HTML disabledプロパティにアプリケーションデータ"mySwitch」を結合しました。

HTMLの入力チェックボックス要素の内容(値)にNG-モデルディレクティブバインド」mySwitch」。

mySwitch trueの場合ボタンは使用できません。

<P>
<ボタン無効になって>私がポイント! </ボタン>
</ P>

mySwitchが falseの場合はボタンを使用することができます。

<P>
<ボタン> 私がポイント!</ボタン>
</ P>

NG-ショー命令

NG-ショー命令は非表示にしたり、HTML要素を表示します。

AngularJS例

<DIV ngのアプリ= "" >

<P NG-ショー= "真 ">私は見えています。 </ P>

<PのNG-ショー= "偽 ">私は見えませんでした。 </ P>

</ DIV>

»をお試しください

(非表示)HTML要素を表示するには、値に基づいて、NG-showコマンド

あなたはブール値(trueまたはfalse)を計算する式を使用することができます。

AngularJS例

<DIV NG-アプリ = "" NG-INIT = "時間= 13 "> <P NG-ショーは= "> 12時間 "> 私は見えています。 </ P> </ DIV>

»をお試しください

ノート 次の章では、我々はすべてのボタンをHTML要素の複数のインスタンスをクリックすることで非表示になります。

ngの非表示コマンド

HTML要素を表示または非表示にするngの非表示コマンドを使用します。

AngularJS例

< div ng-app= "" >

< p ng-hide= "true" >我是不可见的。 < /p >

< p ng-hide= "false" >我是可见的。 < /p >

< /div >

»をお試しください