angularJS 1.x 基础教程总结

最新推荐文章于 2024-06-23 17:16:57 发布

MA10851051Y

最新推荐文章于 2024-06-23 17:16:57 发布

阅读量1.9k

点赞数 1

分类专栏： angularJS 前端文章标签： angularJS

本文链接：https://blog.csdn.net/MA10851051Y/article/details/79724034

版权

看了两天做个总结吧:

个人引用的是

    <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>

ps:注意版本问题,被版本坑了不少

首先angularJS核心就是:

1）依赖注入

2）模块化

3）双向绑定

4）语义化标签

要看本教程之前最好过一遍菜鸟的angularJS教程

第一个Demo很经典的案例:

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myController" >
<div  >
    <input type="text" ng-model="task" class="form-control">
    <button ng-click="add()">提交</button> <br/>
    <h5 ng-if="tasks.length>0">记事本:</h5><br/>
    <ul class="list-group">
        <li ng-repeat="item in tasks track by $index" class="list-group-item">
            {
  {item}}
            <button ng-click="tasks.splice($index,1)">删除</button>
        </li>
    </ul>
</div>
<script type="application/javascript">
    angular.module('myApp',[])
        .controller('myController',function ($scope) {
        $scope.task = "";
        $scope.tasks = [];
        $scope.add=function () {
            $scope.tasks.push($scope.task)
        }
    })
</script>
</body>

只用这么多代码就可以完成类似于任务记录的功能,还是很有意思的

接下来才是学习AngularJS:

首先从service,controller开始

html文件:

<head>
    <meta charset="UTF-8"&

最低0.47元/天解锁文章

MA10851051Y

关注

1
点赞
踩
7

收藏

觉得还不错? 一键收藏
0
评论
angularJS 1.x 基础教程总结

看了两天做个总结吧:个人引用的是 &lt;script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"&gt;&lt;/script&gt;ps:注意版本问题,被版本坑了不少首先angularJS核心就是:1）依赖注入 2）模块化 3）双向绑定 4）语义化标签要看本教程之前最好过一遍菜鸟的angu...
复制链接

扫一扫