Angularjs[22] - 内置渲染指令

最新推荐文章于 2024-08-10 16:15:00 发布

weixin_34353714

最新推荐文章于 2024-08-10 16:15:00 发布

阅读量62

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/bky-1083/p/6358442.html

版权

指令：利用指令来扩展HTML标签，增加声明式语法来实现想做的任何事，可以应用有特殊意义的元素和属性来替换一般的HTML标签。

渲染指令：

ng-init：初始化应用时创建一个变量；
ng-bind：使用给定的变量或表达式的值来替换 HTML 元素的内容；
ng-repeat：

$index：当前索引；
$first：是否为第一个元素；
$middle：是否为非头非尾元素；
$last：是否为尾元素；

ng-include：包含外部 HTML 文件。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <div ng-app="myApp">
        <p>{{1+1}}</p>
        <p ng-bind="1+1"></p>

        <!--$scope.cityArr = ['上海','北京','南京'];-->
        <ul ng-init="cityArr = ['上海','北京','南京']">
            <li ng-repeat="city in cityArr">
                <span>
                    index:{{$index}}
                </span>
                <span>
                    first:{{$first}}
                </span>
                <span>
                    middle:{{$middle}}
                </span>
                <span>
                    last:{{$last}}
                </span>
                <span>
                    {{city}}
                </span>
            </li>
        </ul>

        <div ng-include="'other.html'"></div>
        <div ng-include src="'other.html'"></div>
    </div>

<script type="text/javascript" src="../../vendor/angular/angularjs.js"></script>
<script type="text/javascript" src="app/index.js"></script>
</body>
</html>

转载于:https://www.cnblogs.com/bky-1083/p/6358442.html

weixin_34353714

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Angularjs[22] - 内置渲染指令

指令：利用指令来扩展HTML标签，增加声明式语法来实现想做的任何事，可以应用有特殊意义的元素和属性来替换一般的HTML标签。渲染指令：ng-init：初始化应用时创建一个变量；ng-bind：使用给定的变量或表达式的值来替换 HTML 元素的内容；ng-repeat：$index：当前索引；$first：是否为第一个元素；$middle：是否为非头非尾元素...
复制链接

扫一扫