欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

AngularJS中控制器函數(shù)的定義與使用方法示例

 更新時間：2017年10月10日 12:04:22   作者：Zerone1993  
這篇文章主要介紹了AngularJS中控制器函數(shù)的定義與使用方法,結合具體實例形式分析了AngularJS控制器函數(shù)的定義、綁定及相關使用技巧,需要的朋友可以參考下

本文實例講述了AngularJS中控制器函數(shù)的定義與使用方法。分享給大家供大家參考，具體如下：

HTML正文:

<body ng-app="myApp" ng-controller="myCtrl">
<h2>AngularJS函數(shù)綁定</h2>
<textarea ng-model="message" cols="40" rows="10"></textarea>
<p>
<button ng-click="save()">保存</button>
<button ng-click="clear()">清除</button>
</p>
<p>剩余字數(shù): <span ng-bind="left()"></span></p>
<!-- AngualrJS的顯示和隱藏邏輯控制指令：類似avalon中的ms-visible和knockout的visible指令 -->
<div ng-show="flag">
結果：<font color="red"><span ng-bind="result"></span></font>
</div>

Javascript操作代碼：

/**
 * AngularJS將屬性和函數(shù)直接看作是controller的平等成員，
 * 可以調用函數(shù)按照普通的屬性的調用方式即可(knockout avalon 部分Jquery插件也是使用這種方式定義函數(shù))
 */
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
  $scope.message = "";
  $scope.result="";
  $scope.flag=false;
  $scope.left = function() {return 100 - $scope.message.length;};
  $scope.clear = function() {
    $scope.message = "";
    $scope.result= $scope.message;
    $scope.flag=false;
  };
  $scope.save = function() {
     $scope.result= $scope.message;
     $scope.flag=true;
  };
});

效果：

更多關于AngularJS相關內容感興趣的讀者可查看本站專題：《AngularJS指令操作技巧總結》、《AngularJS入門與進階教程》及《AngularJS MVC架構總結》

希望本文所述對大家AngularJS程序設計有所幫助。

相關文章

  • Angular CLI 使用教程指南參考小結

    Angular CLI 使用教程指南參考小結

    這篇文章主要介紹了Angular CLI 使用教程指南參考小結，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
    2019-04-04
  • angularjs中回車鍵觸發(fā)某一事件的方法

    angularjs中回車鍵觸發(fā)某一事件的方法

    下面小編就為大家?guī)硪黄猘ngularjs中回車鍵觸發(fā)某一事件的方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
    2017-04-04
  • AngularJS中ng-options實現(xiàn)下拉列表的數(shù)據(jù)綁定方法

    AngularJS中ng-options實現(xiàn)下拉列表的數(shù)據(jù)綁定方法

    今天小編就為大家分享一篇AngularJS中ng-options實現(xiàn)下拉列表的數(shù)據(jù)綁定方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
    2018-08-08
  • angular 服務隨記小結

    angular 服務隨記小結

    這篇文章主要介紹了angular 服務隨記小結,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
    2019-05-05
  • Angular中的Promise對象($q介紹)

    Angular中的Promise對象($q介紹)

    這篇文章主要介紹了Angular中的Promise對象($q介紹),本文講解了Promise模式、Q Promise的基本用法、AngularJs中的$q.defferd等內容,需要的朋友可以參考下
    2015-03-03
  • 詳解什么是@ngrx/store開發(fā)包中的MemoizedSelector

    詳解什么是@ngrx/store開發(fā)包中的MemoizedSelector

    這篇文章主要為大家介紹了@ngrx/store開發(fā)包中的MemoizedSelector使用分析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2023-07-07
  • 利用VS Code開發(fā)你的第一個AngularJS 2應用程序

    利用VS Code開發(fā)你的第一個AngularJS 2應用程序

    這篇文章主要給大家介紹了關于利用VS Code如何開發(fā)你的第一個AngularJS 2應用程序的相關資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友下面來一起看看吧。
    2017-12-12
  • AngularJs用戶輸入動態(tài)模板XSS攻擊示例詳解

    AngularJs用戶輸入動態(tài)模板XSS攻擊示例詳解

    這篇文章主要給大家介紹了關于AngularJs用戶輸入動態(tài)模板XSS攻擊的相關資料，文中通過示例代碼介紹的非常詳細，對大家學習或者使用angularjs具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧。
    2018-04-04
  • AngularJS基于MVC的復雜操作實例講解

    AngularJS基于MVC的復雜操作實例講解

    下面小編就為大家分享一篇AngularJS基于MVC的復雜操作實例講解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
    2017-12-12
  • AngularJS實現(xiàn)頁面跳轉后自動彈出對話框實例代碼

    AngularJS實現(xiàn)頁面跳轉后自動彈出對話框實例代碼

    這篇文章主要介紹了AngularJS實現(xiàn)頁面跳轉后自動彈出對話框實例代碼，然后在文章下面給大家介紹了angularjs頁面加載后自動彈窗的實例代碼，感興趣的朋友參考下吧
    2017-08-08

最新評論