Angular学习2

最新推荐文章于 2022-08-24 19:09:37 发布

HurricanGod

最新推荐文章于 2022-08-24 19:09:37 发布

阅读量262

点赞数

分类专栏： AngularJS 文章标签： angular

本文链接：https://blog.csdn.net/qq_34332010/article/details/52460613

版权

AngularJS 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

控制器除了拥有属性外还可以有方法（函数）

<body>

<div ng-app="myApp" ng-init="str1='12'; str2='34'" ng-controller="myCtrl">
  <p>名字 : <input type="text" ng-model="name"></p>
  <h1>Hello {{name}}</h1>
    <br/>
    <input type="text" ng-model="contents">
    <br/>
    {{result()}}
</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.name = "angular Js";
    $scope.result=function()
    {
        return "Hello"+"  "+$scope.name+"   "+$scope.contents;
    }
});
</script>
</body>

此外AngularJS过滤器使用一个管道字符（|）添加到表达式和指令中
过滤器描述
currency 格式化数字为货币格式。
filter 从数组项中选择一个子集。
lowercase 格式化字符串为小写。
orderBy 根据某个表达式排列数组。
uppercase 格式化字符串为大写。

AngularJS 内建了30 多个服务； $location 服务，它可以返回当前页面的 URL 地址，使用 location 服务比使用 window.location 对象更好。

$http 是 AngularJS 应用中最常用的服务。服务向服务器发送请求，应用响应服务器传送过来的数据。

<body>

<div ng-app="myApp" ng-init="str1='12'; str2='34'" ng-controller="myCtrl">
  <p>名字 : <input type="text" ng-model="name"></p>
  <h1>Hello {{name}}</h1>
    <br/>
    <input type="text" ng-model="contents">
    <br/>
    {{result()}}
    <p>{{txt}}</p>
    <p>{{timeStr}}</p>
</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope,$timeout,$interval) {
    $scope.name = "angular Js";

    $scope.txt="Taday is Wednesday!";

    $scope.timeStr=new Date().toLocaleTimeString();
    $scope.result=function()
    {
        return "Hello"+"  "+$scope.name+"   "+$scope.contents;
    }

    $timeout(
        function()
        {
            $scope.txt="Thursday is coming!"
        },3000
    );

    $interval(
        function()
        {
            $scope.timeStr=new Date().toLocaleTimeString();
        },1000
    );
});
</script>
</body>

AngularJS $interval 服务对应了 JS window.setInterval 函数上面代码中给$ interval()传递了两个参数，一个是函数用于创建新的Date对象并设置调用时间参数

$timeout服务在达到设置时间后会跳转去执行相应的函数

HurricanGod

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Angular学习2

控制器除了拥有属性外还可以有方法（函数）<body><div ng-app="myApp" ng-init="str1='12'; str2='34'" ng-controller="myCtrl"> <p>名字 : <input type="text" ng-model="name"></p> <h1>Hello {{name}}</h1> <br/> <input typ
复制链接

扫一扫

专栏目录