angularjs常用简单命令

最新推荐文章于 2021-10-21 11:35:36 发布

小猿init

最新推荐文章于 2021-10-21 11:35:36 发布

阅读量253

点赞数

分类专栏：笔记文章标签： angularjs

本文链接：https://blog.csdn.net/weixin_44841425/article/details/88852229

版权

笔记专栏收录该内容

2 篇文章 0 订阅

订阅专栏

angularjs开发常用命令

导入angularjs的文件

<script type="text/javascript" src="../plugins/angularjs/angular.min.js"></script>

在body标签中添加两个指令 ng-app和ng-controller

<body ng-app="myapp" ng-controller="myctrl">
     
</body>

在脚本语言中，添加angularjs的基本架子

<script type="text/javascript">
    // 1. 初始化module
    var app = angular.module("myapp",[]);
    
    // 2. 初始化控制器
    app.controller("myctrl", function($scope,$http) {
        // 编写具体的业务逻辑
    })


</script>

1.1 ng-model

ng-model 常用于在输入框中绑定用户输入的值。
eg:常见于在输入框中。input textarea checkbox ...

使用ng-model所定义的变量，相当于 是在  $scope中定义的
    即：在整个angularjs的作用范围内，可以通过  $scope来获取对应变量的值

1.2 ng-bind 或 {{ }}

ng-bind 用于在界面中显示数据
eg: <label ng-bind=""/> 。 当需要直接在html界面中显示时，通过 {{}} 来表示。

1.3 ng-click

ng-click 与传统click事件相比，使用angular的点击事件，可以直接调用angular的事件，即使用 $scope定义的事件。

1.4 ng-repeat

ng-repeat 用于在html界面中进行循环操作的指令。
eg: <tr ng-repeat="item in list"/>  ng-repeat写在哪个标签中，将会循环哪个标签。 关键字 in 后面的表示循环体，前面的表示 循环过程中存储的

1.5 ng-show

ng-show 值 boolean类型   设置所在的标签的显示和隐藏

1.6 checkbox ng-true-value

ng-true-value ng-false-value  设置复选框选中和未选中时，指定的值

1.7 select ng-options

ng-options : 主要在下拉列表中使用
使用语法 ：  <select  ng-options="key as value for item in list >

1.8 ng-if ng-hide

ng-if  值 boolean类型   true 显示  false 隐藏
ng-hide 值 boolean  true 隐藏 false 显示

小猿init

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
angularjs常用简单命令

angularjs开发常用命令导入angularjs的文件 <script type="text/javascript" src="../plugins/angularjs/angular.min.js"></script> 在body标签中添加两个指令 ng-app和ng-controller <body ng-app="myapp" ...
复制链接

扫一扫

专栏目录