AngularJSAngularjs基础(十一)

ng-csp       描述:修改内容的安全策略
      实例: 修改AngularJS 中有关”eval”的表现方式及内联样式;
          <body ng-app=”” ng-csp>
      定义和用法
          ng-csp 指令用于修改AngularJS 的安全策略。
          倘若运用了ng-csp指令,AngularJS 执行eval
函数,但允许注入内联样式。
          设置ng-csp 指令为no-unsafe-eval 将阻止AngarJS
执行eval 函数,但允许注入内联样式。
          设置ng-csp指令为no-inline-style 将阻止AngularJS
注入内联样式,但允许实施eval 函数。
      语法:<element ng-csp=”no-unsafe-eval | no
inline-style”></element>
      参数值: 值:no-unsafe-eval 描述:值可以安装为空,意味着eval
和内联样式都被允许。
          值:no-inline-style 描述: 可以安装
其中一个值,你有可以设置七个值使用分号隔开了。

ng-cut       规定剪切事件的行为
        实例:输入框的文本被分割是执行的表达式
          <input ng-cut=”count = count + 1″
ng-init=”count=0″ value=”剪切这一个文件”>
        定义和用法
          ng-cut 指令用于告诉AngularJs 在细分HTML
元素的公文时须求执行的操作。
          ng-cut指令指令不会覆盖元素的原始oncut事件,事件触发时,ng-cut表达式与原本的oncut
事件都会履行。
        语法:<element
ng-cut=”expression”></element>
        参数值: 值:expression
描述:元素文本被分开是履行的表达式。

ng-dblclick      规定双击事件的一颦一笑
        实例:在每便鼠标点击时,变量count加1;
          <h1 ng-dblclick=”count = count + 1″ ng-init
=”count = 0″></h1>
        定义和用法
          ng-dblclick 指令用于告诉AngularJS 在鼠标鼠标HTML
元素是内需进行的操作。
          ng-dblclick 指令指令不会覆盖元素的原始 ondblclick
事件, 事件触发时,ng-dblclick 表明式与原本的 ondblclick
事件将都会实施。
        语法:<element
ng-dblclick=”expression”></element>
        参数值: 值: expression 描述:
鼠标双击元素后实施的表明式。

ng-disabled       规定一个元素是还是不是被剥夺
          实例:禁用或启用输入框
              禁用表单输入域:<input type=”checkbox”
ng-model=”all”>
                <input type=”text”
ng-disabled=”all”>
                <input type=”radio”
ng-disabled=”all”>
                <select ng-disabled=”all”>
                  <option>Female</option>
                  <option>Male</option>
                </select>
         定义和用法
              ng-disabled 指令设置表单输入字段的 disabled
属性
              语法:值: expression
描述:假使表明式重回true,则设置为要素添加disabled属性。

ng-focus         规定典型事件的表现
AngularJS,          实例:当输入框获取关节时进行表明式:
            <input ng-focus=”count = count + 1″
ng-init=”count=0″>
            <h1>{{count}}</h1>
        定义和用法
            ng-focus 指令用于告诉AngularJS 在HTML
元素或获得关节时实施的操作。
        语法:<element
ng-focus=”expression”></element>
        参数值: 值:expression
描述:元素得到关节时实施的表达式。

ng-form
        指定HTML表单继承控制器表单

ng-hide           隐藏或显示HTML
        实例:在复选框选中时应从一部分;
        隐藏 HTML: <input type=”checkbox”
ng-model=”myVar”>
            <div ng-hide=”myVar”>
            <h1>Welcom</h1>
            <p>Welcome to my home</p>
            </div>
      定义和用法
        ng-hide 指令在表达式为true 时隐藏HTML 元素。
        ng-hide 是AngularJS 的预定义类,设置元素的display
为none.
    语法:<element ng-hide=”expression”></element> 作为
CSS 类使用: <element class=”ng-hide”></element>
    参数值: 值: expression 描述 表明式假若回去true 则隐藏元素。

ng-href         为the<a>元素指定连接
        实例:使用AngularJS设置添加链接
        <div ng-init=”myVar = ‘http:www.runoob.com'”>
          <h1>123</h1>
          <p>访问<a
ng-href=”{{myVar}}”>{{myVar}}</a></p>
        </div>
      定义和用法: ng-href
指令覆盖了原生的<a>元素href属性。
      如若在href的值中油AngularJs ,则必要选拔ng-href而不是href.
      语法: <a ng-href=”string”></a>
      参数值:值:expression 描述:字符串,表达式。

ng-if         即使基准为false 移除HTMl元素。
       实例:废除选中并移除内容
          <input type=”checkbox” ng-model = “myVar”
ng-init=”myVar = true”>
          <div ng-if=”myVar”>
            <h1>Welcome</h1>
            <p>Welcome to my home</p>
          <div>
      定义和措施: ng-if指令用表达式为false 时移除HTML 元素。
            假若if语句执行的结果为true,会添加移除元素,并出示。
            ng-if 指令不一样于ng-hide,
ng-hide隐藏元素。而ng-if 是从DOM 中移除元素。
      语法: <element ng-if=”expression”></element>
      参数值: 值:expression
描述:假设表明式再次回到false则会移除整个因素,即使为true,则会添美元素。

ng-include         描述:在运用中包含移除HTML元素。
          实例:包含HTML 文件
            <div
ng-include=”‘myFile.htm'”></div>
          定义和用法:ng-include 指令用于包蕴外部的HTML
文件。包括的情节作为指定元素 的子节点。
          语法:<element ng-include=”filename”
onload=”expression” autoscroll=”expression” ></element>
          参数值: 值: filename
描述:文件名,可以运用表明式来回到文件名。
              值: onload 描述:
可选文件载入后举办的表明式。
              值: auto
可选,包罗的局地文件是不是在执行视图上可滚动。

ng-init           描述:定义应用的开头化值。
          实例:初阶化应用时成立一个变量:
            <div ng-app=”” ng-init=”myText=’Hello
World'”></div>
            <h1>{{myText}}</h1>
          定义和用法: ng-init 指令执行给定的表达式。
            ng-init 指令添加一些不要求的逻辑到 scope
中,提议你可以在控制器中 ng-controller 指令执行它 。
            语法:<element
ng-init=”expression”></element>
            参数值: 值: epression 描述: 执行的表达式。

ng-jq
          描述:定义应用必须接纳到的库。

ng-keydown       描述:规定按下键事件的作为:
          实例:按下键是执行的代码:
            <input ng-keydown=”count = count + 1″
ng-init=”count=0″/>
            <h1>{{count}}</h1>
          定义和用法:ng-keydown 指令告诉AngularJS在制订HTML
元素上按下键时索要的操作。
          按键敲击的事件顺序: 1.Keydown 2.Keypress 3.Keyup
          语法: <element
ng-keydown=”expression”></element>
          参数值:值: epession 描述 按下键执行的表达式。

ng-keypress         描述:规定按下按键事件的表现
          实例:按下按键时施行的代码:
              <input ng-keypress = “count= count + 1″
ng-init=”count=0”>
              <h1>{{count}}</h2>
          定义和用法:
              ng-keypress 指令用于告诉 AngularJS 在指定
HTML 元素上按下按键时内需的操作。
              按键敲击的风云顺序: 1.Keydown 2.Keypress
3.Keyup
          参数值: 值:expression 描述: 按下键执行表明式。

ng-keyup           描述:规定松手键盘事件的作为。
        实例:按键松手时执行的代码:
          <input ng-keyup=”count = count = 1″
ng-init=”count=0″/>
          <h1>{{count}}</h1>
        定义和用法 :ng-keyup 指令用于告诉 AngularJS 在指定 HTML
元素上按键松手时要求的操作。
        按键敲击的风浪顺序: 1.Keydown 2.Keypress 3.Keyup
        参数值:expression 描述; 按键放手执行的表达式。

ng-list           描述:将文件转换为列表。
        实例: 转换用户的输入为数组。
        <div ng-app=””>
          <input ng-model=”customer” ng-list>
          <pre>{{customers}}</pre>
        定义和用法: ng-list
指令将字符串转换为数组,并选拔逗号分隔。
        语法: <element ng-list
=”separator”></element>
          <input>, <select>, <textarea>,
和其余可编制元素协助该指令。
        参数值: 值 separator 描述: 可选定义分隔符,默许为.

ng-model         描述:绑定HTML控制器的值到应用数据。
          实例:绑定输入的值到scope变量中;
            <div ng-app=”myApp”
ngcontroller=”myCtrl”>
              <input ng-model=”name”>
            </div>
            <script>
                  var app =
angular.module(‘myApp’,[]);
                  app.controller(‘myCtrl’,function($scope){
                      $scope.name=”John Doe”
                  })
            </script>
         定义和用法:
              ng-model 指令绑定了HTML 表单元素到scope
变量中。
              假诺scope 中不设有变量,将会创立。
        语法:<element ng-model=”name”></element>
        参数值:值: separator 描述: 你要半丁到表单域的属性名。

相关文章