关于angularjs的简单使用

前言angularjs无疑是一款实现前后端分离js库,利用mvc的思想进行,它的使用也是很简单的。

下面我就简单的介绍一下平时我们用的最多的表格和导航。

1、在页面的开始引用angularjs库。

2、在一个页面中会有地方运用到angularjs,那么在body就开始调用angularjs的必要的东西ng-app="myApp" ng-controller="myCtrl"

3、angularjs所要交互的数据都是用{{}}包起来的,比如说,test这个数据是要进行前后端交互的数据,那么就直接{{text}}这样子写就可以了。

4、这个就是具体的使用

5、

6、之后你还要写一个js去调用json数据。在开始的学习中,没有借口,可以自己写一些静态的数据进行测试。report_th这些命名自己随意起就好,但在调用的时候记得统一。

7、有接口之后就简单多了,

这个就是直接调用接口的。

8、完美引用,希望对大家有帮助

时间: 2024-12-16 21:25:55

关于angularjs的简单使用的相关文章

用angularjs做简单的tab切换

用angularjs做简单的tab切换: 页面部分 <div> <div id="tabs" ng-controller="TabsCtrl"> <ul> <li ng-repeat="tab in tabs" ng-class="{active:isActiveTab(tab.url)}" ng-click="onClickTab(tab)">{{tab.t

[angularjs] MVC + Web API + AngularJs 搭建简单的 CURD 框架

MVC + Web API + AngularJs 搭建简单的 CURD 框架 GitHub 地址:https://github.com/liqingwen2015/Wen.MvcSinglePage 布局页的引用 <script src="~/Scripts/jquery-1.10.2.min.js"></script> <script src="~/Scripts/bootstrap.min.js"></script&g

对AngularJs的简单了解

一.简单介绍 AngularJS是为了克服HTML在构建应用上的不足而设计的.HTML是一门很好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了.所以我做了一些工作(你也可以觉得是小花招)来让浏览器做我想要的事. 通常,我们是通过以下技术来解决静态网页技术在构建动态应用上的不足: 类库 - 类库是一些函数的集合,它能帮助你写WEB应用.起主导作用的是你的代码,由你来决定何时使用类库.类库有:jQuery等 框架 - 框架是一种特殊的.已经实现了的WEB应用,你只需要对它填充

Angularjs实现简单分页

一个后台中总需要一款分页,那我为了自己方便使用,实现如下效果 我把这个组件命名为tm.pagination,原因是因为起名真的太难起了.而且我网名也叫天名, TM就这样了吧.github地址https://github.com/miaoyaoyao/AngularJs-UI 分页在线查看 点击预览 http://demo.miaoyueyue.com/js/ng/AngularJs-UI/demo/pagination.html 分页兼容性 对不起,我不会去测试老掉牙的ie8浏览器.目前测试了i

AngularJS 实现简单购物车

使用AngularJS实现一个简单的购物车,主要感受强大的双向绑定和只关注对象不关注界面特性. 先看看界面: 点击+-操作和删除: 这些全部只需要操作数据源就行,不需要关注界面. 实现过程: 一.使用任何语言创建一个服务端: public class ShoppingCar { public string Title { get; set; } public decimal UnitPrice { get; set; } public int Count { get; set; } } publ

angularJS搭建简单应用程序的基本架构分析

本文以一个基于angularJS框架的简单应用分析angularJS应用的基本架构 1.理解几个基本概念 1.1 angularJS控制器 对于刚入门的童鞋来说,提到控制器可能想到了就是电器上的一些开关或者控制设备等,实际上,在JavaScript编程中也有控制器这一概念,angularJS控制器(以下简称控制器)指的是附加在文档对象模型(DOM)节点上的函数,用来驱动应用程序的逻辑.通俗的说就是把一部分的JavaScript功能(方法)封装在一个js文件中,在html文件中进行调用来实现一些功

AngularJS的简单使用

官网下载:AngularJS 路由视图需要:Angular-Route.js 基于zepto的轻量级的 JavaScript UI 库: App.js  用于开发跨平台的移动Web应用 <!DOCTYPE html><html ng-app='mainApp'> <head> <title>简单AngularJS使用</title> <meta charset="utf-8"> <meta http-equi

AngularJS实现简单的分页功能

本篇文章由:http://xinpure.com/angularjs-simple-paging-functionality/ 初学 AngularJS, 尝试着写一些小功能 代码逻辑写得略粗糙,仅仅只是实现了简单的分页功能,使用 AngularJS 尝尝鲜. AngularJS Code (Users.js) var Users = angular.module('Users', []); Users.controller('UserList', function($scope, $http)

AngularJs最简单解决跨域问题案例

我们以两个主域名或者一个主域名+一个二级域名为例,均可演示跨域问题. 客户端 a.com 服务端 b.com或者s.a.com angularJs版本 V1.2.25 准备工作做得很充分嘛,就差把我们的编辑器是subline暴露出来了,这个一般人我是不告诉他滴. 有人嚷嚷了,这问题老早就有了,你现在提出来有啥意义呢?难不成你还能把花忽悠开了?嗯,我还真能把花写开了.看戏吧,我们本篇要上演的是完整版跨域实例. 接下来我们先看客户端是如何请求数据的 注意哦,我们的代码是写在a.com域名下面的 <!