[angularjs] angularjs系列笔记（八）事件

发布时间：2020-12-17 10:38:38 所属栏目：安全来源：网络整理

导读：AngularJs ng-click ng-click div class="cnblogs_code" span style="color: #0000ff;"gt;/spanspan style="color: #800000;"gt;div /spanspan style="color: #ff0000;"gt;ng-controller/spanspan style="color: #0000ff;"gt;="ngClickTest"/spanspan style=

AngularJs

ng-click

ng-click

  
    
  <span style="color: #0000ff;"&gt;<</span><span style="color: #800000;"&gt;div </span><span style="color: #ff0000;"&gt;ng-controller</span><span style="color: #0000ff;"&gt;="ngClickTest"</span><span style="color: #0000ff;"&gt;></span><span style="color: #000000;"&gt;
    测试ng-click指令
    </span><span style="color: #0000ff;"&gt;<</span><span style="color: #800000;"&gt;button </span><span style="color: #ff0000;"&gt;ng-click</span><span style="color: #0000ff;"&gt;="count=count+1"</span><span style="color: #0000ff;"&gt;></span>点击<span style="color: #0000ff;"&gt;</</span><span style="color: #800000;"&gt;button</span><span style="color: #0000ff;"&gt;></span><span style="color: #000000;"&gt;
    {{count}}
  </span><span style="color: #0000ff;"&gt;</</span><span style="color: #800000;"&gt;div</span><span style="color: #0000ff;"&gt;></span>
<span style="color: #0000ff;"&gt;</</span><span style="color: #800000;"&gt;div</span><span style="color: #0000ff;"&gt;></span>
<span style="color: #0000ff;"></<span style="color: #800000;">body<span style="color: #0000ff;">>
<span style="color: #0000ff;"><<span style="color: #800000;">script <span style="color: #ff0000;">type<span style="color: #0000ff;">="text/javascript"<span style="color: #0000ff;">>

<span style="background-color: #f5f5f5; color: #008000;">//<span style="background-color: #f5f5f5; color: #008000;">实例化应用对象，参数：模块名，空数组

<span style="background-color: #f5f5f5; color: #0000ff;">var<span style="background-color: #f5f5f5; color: #000000;"> app<span style="background-color: #f5f5f5; color: #000000;">=<span style="background-color: #f5f5f5; color: #000000;">angular.module(<span style="background-color: #f5f5f5; color: #000000;">"<span style="background-color: #f5f5f5; color: #000000;">Home<span style="background-color: #f5f5f5; color: #000000;">"<span style="background-color: #f5f5f5; color: #000000;">,[]);

app.controller(<span style="background-color: #f5f5f5; color: #000000;">"<span style="background-color: #f5f5f5; color: #000000;">ngClickTest<span style="background-color: #f5f5f5; color: #000000;">"<span style="background-color: #f5f5f5; color: #000000;">,<span style="background-color: #f5f5f5; color: #0000ff;">function<span style="background-color: #f5f5f5; color: #000000;">(){})

<span style="color: #0000ff;"></<span style="color: #800000;">script<span style="color: #0000ff;">>

ng-click指令结合ng-hide显示隐藏html

给ng-click指令绑定一个函数，给ng-hide指令赋值一个变量，在控制器中分配默认变量和分配函数

  <span style="color: #0000ff;"&gt;<</span><span style="color: #800000;"&gt;div </span><span style="color: #ff0000;"&gt;ng-controller</span><span style="color: #0000ff;"&gt;="ngClickTest"</span><span style="color: #0000ff;"&gt;></span><span style="color: #000000;"&gt;
    测试ng-click指令
    </span><span style="color: #0000ff;"&gt;<</span><span style="color: #800000;"&gt;button </span><span style="color: #ff0000;"&gt;ng-click</span><span style="color: #0000ff;"&gt;="toggle()"</span><span style="color: #0000ff;"&gt;></span>点击<span style="color: #0000ff;"&gt;</</span><span style="color: #800000;"&gt;button</span><span style="color: #0000ff;"&gt;></span>
    <span style="color: #0000ff;"&gt;<</span><span style="color: #800000;"&gt;div </span><span style="color: #ff0000;"&gt;ng-hide</span><span style="color: #0000ff;"&gt;="flag"</span><span style="color: #0000ff;"&gt;></span><span style="color: #000000;"&gt;
        姓名：{{name}}
    </span><span style="color: #0000ff;"&gt;</</span><span style="color: #800000;"&gt;div</span><span style="color: #0000ff;"&gt;></span>
  <span style="color: #0000ff;"&gt;</</span><span style="color: #800000;"&gt;div</span><span style="color: #0000ff;"&gt;></span>
<span style="color: #0000ff;"&gt;</</span><span style="color: #800000;"&gt;div</span><span style="color: #0000ff;"&gt;></span>

</body>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!