AngularJs——常用标签

最新推荐文章于 2023-09-14 11:29:46 发布
最新推荐文章于 2023-09-14 11:29:46 发布
阅读量1.2k 收藏
点赞数
文章标签： angularjs
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u014491921/article/details/39453059
版权

1、ng-app：告诉Angular他应该管理页面的那一部分，可以放在html元素上也可以放在div等标签上   

例如：<html ng-app="problem">

2、ng-controller:控制器，通过在body标签上包含一个控制器，则可以管理body标签之间的任何东西，也可以放在div上，来控制这一个div上的任何东西

例如：<body ng-controller="problemController">

3、ng-repeat:数组中每个元素进行for循环

例如：<tr ng-repeat="info in problem.infos">
                <td>
                <div>
                <p>{{info.ClientOrgName}}</p>
                <p>({{info.ClientPerson}}  {{info.ClientPhone}})</p>
                </div>
                </td>
                <td>{{info.BusinessName}}</td>
                <td>
                <a href="" ng-click="problem.viewProblemDepict($index)">{{info.ProblemDepict}}</a>
                </td>
                <td>{{info.CreatePerson}}</td>
                <td>
                <div ng-if="info.State==3"></div>
                <div ng-else>{{info.RealName}}</div>
                </td>
                <td>
  <div ng-if="info.State==1">未解决</div>
                  <div ng-if="info.State==2">已解决</div>
                  <div ng-if="info.State==3">完成</div>
  </td>
             </tr>
            <tr data-ng-if="problem.infos.length==0">
                <td colspan='8'>
                    <div style="text-align: center;">没有符合条件的项</div>
                </td>
            </tr>
         </table>

4、{{......}}：将变量的值插入到页面某部分和保持同步

5、ng-model=’…’:创建了输入字段和…的数据绑定，{{.......}}建立的是单向的联系

6、currency：过滤器，讲我们做的这个美元形式格式化

7、ng-click：点击事件

8、ng-bind：与{{......}}等价

9、ng-model:能与checkbox、input、radio等标准的元素正常的工作，如checkbox：SomeController中的$scope有一个youCheckedit的属性，选中为true没选中则为false

10、ng-change:change事件

12、ng-submit自动的阻止浏览器发送默认的post动作

13、ng-src、ng-href与src、href等同

14、ng-option：在select用到，就是讲option里的对象动态的生成。

（此处为大概的总结，详情接下来会一一介绍）

佑右
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
angularJS——三种自定义service方法
12-10
angularJS中，使用自定义的service实现一个数的立方，
angualrjs随笔记之常用标签
qq_15076569的博客
10-28 2565
ng-app：定义大作用域 ng-controller：定义控制器范围的作用域   得到app对象： var app = angular.module('pyg',[]); 得到controoler对象： app.controller('goodsController' ,function($scope,uploadService,goodsService){...} 得...
angularjs-标签页tab选项卡
火星男孩的分享空间
03-07 8813
选项卡一：JavaScript+html+css<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> #div1 .active{ background:blue; } #div1 div{
Angular的一些标签元素的详解和使用
qq_44327851的博客
09-14 484
运行上面这个例子，我们可以看到运行界面什么都没有显示出来，这是正常结果，也是预期结果，因为这里只是定义了，并还没有与其它结构型指令一起使用。包含的内容，如果不通过其他指令控制，会直接渲染到页面中。是一个模板元素，它永远不会自动渲染在视图上，在渲染视图之前，Angular 会把及其内容替换为一个注释，，因为我们如果把这两个指令同时放在一个div上，会出现报错，放在两个div上，就会有一个多余的div占据位置影响样式，结构型指令中的一种，用于包含控制内部元素的显示与否。
angularjs自定义标签
爱吃鱼油
07-23 1936
jquery angluarjs
AngularJS 最常用的八种功能
09-17
AngularJS 最常用的八种功能 一些有用的参考文档
angularJS常用标签
Chen_sj的博客
05-03 1098
1、ng-app：告诉Angular他应该管理页面的那一部分，可以放在html元素上也可以放在div等标签上   例如：&lt;html ng-app="problem"&gt;2、ng-controller:控制器，通过在body标签上包含一个控制器，则可以管理body标签之间的任何东西，也可以放在div上，来控制这一个div上的任何东西例如：&lt;bodyng-controller="pro...
AngularJs 常用指令标签
weixin_30900589的博客
10-13 86
1、ng-app：告诉Angular他应该管理页面的那一部分，可以放在html元素上也可以放在div等标签上 例：<html ng-app="problem"> 2、ng-controller:控制器，通过在body标签上包含一个控制器，可以管理body标签之间的任何东西，也可以放在div上，来控制这一个div上的任何东西例如：<body ng-controller=...
angular2--常用标签[(ngModel)]、*ngFor、*ngIf等等
Ariel的博客
12-20 1751
常用标签 一、跳转事件 html： &amp;amp;amp;lt;div (click)=&amp;amp;quot;goPage('prevPage')&amp;amp;quot;&amp;amp;amp;gt;&amp;amp;amp;lt;/div&amp;amp;amp;gt; //跳转到上一页 &amp;amp;amp;lt;div (click)=&amp;amp;quot;goPage('nextPage')&amp
angularjs标签的应用
qq_34946077的博客
03-16 455
一、ng-repeat遍历，选中一行，让其变色。 html： <tr ng-repeat="x in xx" ng-class="{'warning':scopeIDs==x.time}"> <td align="center" ng-click="toPreView(x.time)">{{x.time | date:"yyyy-MM-dd"}}</td...
HTML5新特性之语义化标签
11-21
HTML5新特性 简洁的DOCTYPE： HTML5 只有一个简单的文档类型：<!DOCTYPE html>，表示浏览器会按照标准模式解析。 简单易记的编码类型 你现在可以在meta 标签中使用”charset”：<meta charset=”utf-8″ /> 脚本和链接无需type <link rel="stylesheet" href="path/to/stylesheet.css" /> [removed][removed] 更加语义化的新增标签 比如说：<article>、<section>、<aside>、<hgroup>、 <hea
深究AngularJS——ng-checked（回写：带真实案例代码）
10-19
本篇文章主要介绍了深究AngularJS——ng-checked（回写：带真实案例代码），具有一定的参考价值，感兴趣的小伙伴们可以参考一下
初学AngularJs——2048小游戏实现，使用WSAD操作方向
08-03
使用一些AngularJs的基础功能点写的2048小游戏，支持W、S、A、D 操作
nwk-videochat:Node-Webkit、WebRTC 和 Angularjs——视频聊天客户端
06-02
nwk-videochat
企业数字化转型暨数据仓库（数仓）建设方案.pptx
05-06
企业数字化转型暨数据仓库（数仓）建设方案.pptx
2024年中国LED切割灯行业研究报告.docx
05-06
2024年中国LED切割灯行业研究报告
目前世界上最好的机器学习&深度学习&神经网络&图神经网络&卷积网络&多层感知机画图工具&基于PPT
05-06
在当今快速发展的人工智能领域中，一款集成了机器学习、深度学习、神经网络、图神经网络、卷积网络及多层感知机可视化功能的画图工具脱颖而出，成为全球范围内最受欢迎和认可的工具之一。这款工具不仅仅是一个简单的绘图软件，它的设计初衷是为了让复杂的网络结构和算法直观化，从而帮助研究者、学者及开发人员更容易地理解和分享他们的工作。 最令人印象深刻的特色之一是它基于PPT的编辑能力，这允许用户在熟悉的PPT编辑环境中创建、编辑和展示复杂的网络结构。用户可以利用拖拉组件、调整尺寸、修改颜色和形状等功能，无缝地将科研成果或项目展示集成到演示文稿中，极大地提高了工作的效率和表现力。 该工具不仅支持广泛的网络结构和模型，还包含丰富的库和模块，让用户能够轻松自定义和扩展自己的模型。它的用户界面友好、直观，无论是机器学习的新手还是资深研究员，都能快速上手，将精力更多地集中在创新和研究上，而不是图形的绘制和编辑上。 此外，它强大的共享和合作功能，使得团队成员可以实时共享他们的成果，促进了知识的交流和项目的进展。这款工具不仅改善了人工智能领域内部的工作方式，也为更广泛的受众提供了学习和理解复杂算法的窗口。 总
2024年中国B型超声诊断设备行业研究报告.docx
05-06
2024年中国B型超声诊断设备行业研究报告
node-v11.0.0-linux-armv7l.tar.xz
最新发布
05-06
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
angularJS img 标签 设置点击事件
05-30
要为AngularJS中的img标签设置点击事件，可以使用ng-click指令。具体步骤如下： 1. 在img标签上添加ng-click指令，然后将其设置为要调用的控制器方法的名称，如下所示： ``` <img src="path/to/image" alt="Image" ng-click="onImageClick()"> ``` 2. 在控制器中实现该方法，如下所示： ``` angular.module('myApp', []) .controller('myCtrl', function($scope) { $scope.onImageClick = function() { // 处理点击事件的逻辑 }; }); ``` 这样，当用户在img标签上单击时，AngularJS将调用该方法并执行其中的逻辑。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值