码迷,mamicode.com
首页 > Web开发 > 详细

关于AngularJS的初步使用

时间:2019-10-06 16:41:32      阅读:96      评论:0      收藏:0      [点我收藏+]

标签:服务器   集合   res   依赖关系   引入   control   声明   on()   基本   

一丶基本使用mvc模式(<script src="angular.min.js"></script>)
  model:数据,可以实现双向绑定,全局通用,即为Angular变量,格式为$scope.xx

  view:数据的呈现,Html与指令(Directive)相结合 

  controller:操作数据,就是利用function操作,实现与增删改查

二丶创建model,controller与service

   1.var app = angular.model("自定义木块名",["应用的模块"])

   2.app.service("自定义服务名称",function($http)){this.方法名称=function(参数){return服务链接,如与后台交互的连接}}

        示例:  app.service("brandService",function ($http) {

                this.findAll=function(){

                 return $htttp.get("交互的url")}

  3.app.controller("自定义控制器名称",function($scope,服务器名称)){控制层,操作数据}

        示例:$scope.findAll=function () {

            服务名称.方法名().success(function (response){

                $scope.list=response;}

  4.三层分别定义在不同的js文件中,但是如果有依赖关系,在页面引入相关js文件时注意上下位置。如定义模块app的js 文件应该位于service和controller上边。

三丶一些简单的指令

  1.ng-app="模块名"  启用一个模块,声明在body标签中,在该标签内部的angular指令才会被解析识别

  2.ng-controller="控制器名" 使用在body标签中,告知该body内容由该控制器来控制

  3.ng-init="eg:name=.."  用来初始化变量 

  4.ng-model="变量" 在标签内部定义变量,实现双向绑定,在controller中使用

  5.ng-repeat="变量名 in 集合"  遍历数据,集合为controller中定义出来

  6.$event为标签状态,一般作为参数传递给controller中,比如复选框的选中状态 $event.target.checked

四丶控制器继承

  伪继承,使两个$scope通用,从而达到继承的效果。

  格式:$controller("被继承的控制器",{$scope:$scope})

  

关于AngularJS的初步使用

标签:服务器   集合   res   依赖关系   引入   control   声明   on()   基本   

原文地址:https://www.cnblogs.com/hanpi/p/11627560.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!