zoukankan      html  css  js  c++  java
  • 初级angular

    前几个月,又是过年,又是项目,今天补一篇。

      angular是google产的,其他没怎么关心,学习主要是数据的双向绑定,是一个MVC框架,V就是html页面,C即angular的controller,M就是数据对象。

      angular的形式是个app,声明方式就是在父级data-ng-app=' ';或者ng-app=' ';

      <div ng-app=""></div>这样就定义了一个angularJS的应用程序,这只是一个声明,一个html页面默认只有一个angular程序,若含有多个,第二个及以后的angular程序就自己手动激活:

      <div ng-app='appOne' id='one'></div>

      <div ng-app='appTwo' id='two'></div>

      <div ng-app='appThree' id='three'></div>

      //添加多个,激活除了第一个以外的app

      <script>

        var one = angular.module('appOne', []);  //angular的模块入口,加载controller,service等模块

        var two = angular.module('appTwo', []);

        var three = angular.module('appThree', []);

       //激活程序

        angular.element(document).ready(function(){

          angular.boostrap(document.getElement('two'), ['appTwo']);

          angular.boostrap(document.getElement('three'), ['appThree']);

        });

         </script>

      

      再说一下程序与元素的数据双向绑定

      主要用到的是ng-model属性和ng-bind({{}}),若你要初始化一个app的数据,可以用ng-init属性;

      <div ng-app='' ng-init='x=5'>

        <p><input type='text' ng-model='num'/></p>

        <p ng-bind='num'></p>

        <p>{{x}}</p>

      </div>

      继续说angular中的ajax吧:

      angular中的ajax主要用到angular中的$http服务,用于读取远程服务器的数据(也可以数据库哦),$http.post(url).success(),$http.get(url).success();

      <div ng-app='app' ng-controller='ctrl'>

        <ul>

          <li ng-repeat='x in num'></li>

        </ul>

      </div>

      <script>

        var app = angular.module('app', []);

        app.controller('ctrl', function($scope, $http){

          //如果用到post,直接把get换成post

          $http.get(url).success(function(response){

            $scope.num = response.num;

          });

        });

      </script>

      angular中的service,directive,controller是什么?我们该如何用它?

      敬请下期!

    ps:由于加载效率问题,请把angular放到底部,那么相应的写的脚本也要放到底端,否则会报错!

  • 相关阅读:
    微服务-Nacos
    微服务RPC框架-Feign
    读书笔记之《大型分布式网站架构设计与实践》
    读书笔记之《Java并发编程的艺术》—— 四
    读书笔记之《Java并发编程的艺术》—— 三
    读书笔记之《Java并发编程的艺术》—— 二
    读书笔记之《Java并发编程的艺术》—— 一
    noip2021 训练4 做题记录
    noip 训练 (线段树专项)
    UVA11671 矩阵中的符号 Sign of Matrix 题解
  • 原文地址:https://www.cnblogs.com/JustinBaby/p/5247405.html
Copyright © 2011-2022 走看看