📝 AngularJS教程

376篇技术文档
  AngularJS和Angular2 |特点与比较

📅  最后修改于: 2021-05-13 20:36:31        🧑  作者: Mango

AngularJS:这是一个前端动态JavaScript框架,用于开发“单页应用程序”。 AngularJS由Google管理,并且是开源的。这意味着它可以向全球的开发人员开放。因此,有许多在线免费材料可供学习技术。发布之后,AngularJS迅速流行起来。这是因为它提供给开发人员的大量功能,例如数据绑定,更容易的事件处理等。Angular 2:它基于“ Typescript”。 Typescri...

  如何使用<mat-divider>在角材料中?

📅  最后修改于: 2021-05-13 20:36:52        🧑  作者: Mango

Angular Material是一个由Angular团队开发的UI组件库,用于为台式机和移动Web应用程序构建设计组件。为了安装它,我们需要在项目中安装angular,一旦安装,您可以输入以下命令并下载。<mat-divider>标记用于用水平线分隔两个部分或内容。安装语法:方法:首先,使用上述命令安装角材。完成安装后,从app.module.ts文件中的’@ angular / materia...

  AngularJS |模组

📅  最后修改于: 2021-05-13 20:37:18        🧑  作者: Mango

AngularJS模块定义了应用程序的功能,该功能应用于整个HTML页面。它有助于链接许多组件。因此,这只是一组相关组件。它是一个由不同部分组成的容器,例如控制器,服务,指令。注意:此模块应在普通的HTML文件(如index.html)中制作,并且无需在VisualStudio中为此部分创建新项目。如何创建模块:在此[]中,我们可以添加所需组件的列表,但是在这种情况下,我们不包括任何组件。通过将创...

  如何在页面加载时执行AngularJS控制器函数?

📅  最后修改于: 2021-05-13 20:37:41        🧑  作者: Mango

任务是使用AngularJS在页面加载时执行/调用JS函数。此函数可用于执行初始化。在AngularJS中调用函数或在页面加载时初始化单个值非常容易。 AngularJS为我们提供了专用于此特定任务的指令。这是ng-init指令。句法:示例1:在此示例中,我们将调用一个函数以在页面加载时初始化变量。输出:该函数在页面加载时调用,变量gfg的值设置为GeeksForGeeks。示例2:在本示例中,我...

  Angular 4和Angular 5之间的区别

📅  最后修改于: 2021-05-13 20:37:58        🧑  作者: Mango

Angular 4:Angular 4是在AngularJS正式发布5年后发布的。 Angular 4是基于JavaScript的开源框架,用于在JavaScript,HTML和TypeScript(JavaScript的超集)中构建Web应用程序。 Angular 4于2017年3月推出,并支持TypeScript 2.2和2.1等早期TypeScript版本。Angular 5:Angular...

  AngularJS | ng-bind-html指令

📅  最后修改于: 2021-05-13 20:38:18        🧑  作者: Mango

AngularJS中的ng-bind-html指令用于将HTML元素的innerHTML绑定到应用程序数据,并从HTML字符串删除危险代码。对于ng-bind-html指令,必须使用$ sanitize服务。所有HTML元素都支持它。句法:示例:此示例说明了ng-bind-html指令。输出:...

  如何在Angular5中的每条路线单击上滚动到顶部?

📅  最后修改于: 2021-05-13 20:38:48        🧑  作者: Mango

我们可以使用“ @ angular / router”中的Router和NavigationEnd,因此可以滚动到每个路线的网页顶部。方法:首先,我们需要从app.module.ts文件和app.component.ts中的“ @ angular / router”导入Router和NavigationEnd。然后我们需要在构造函数创建一个实例。创建实例后,我们需要在ngOninit()生命周期挂...

  AngularJS | ng-jq指令

📅  最后修改于: 2021-05-13 20:39:08        🧑  作者: Mango

ng-Jq指令允许强制由angular.element库使用的库。当我们将ng-jq留为空白时,应该发生jQLite的强制,否则应在窗口下设置jquery变量的名称(例如jQuery)。 jQLite直接内置于AngularJS中,是jQuery的重要子集。默认情况下,AngularJS使用jQLite。当需要加载该指令时,AngularJS会查看该指令,它根本不等待DOMContentLoade...

  角度8中的属性绑定

📅  最后修改于: 2021-05-13 20:39:29        🧑  作者: Mango

属性绑定是一种单向数据绑定技术。在属性绑定中,我们将DOM元素的属性绑定到字段,该字段是组件TypeScript代码中的已定义属性。实际上,Angular在内部将字符串插值转换为属性绑定。在此,我们将已定义元素的属性绑定到HTML DOM元素。句法:方法:在app.component.ts文件中定义属性元素。在app.component.html文件中,通过将属性值分配给app.component...

  当应用程序在Angular 8中处于脱机状态时,如何自动保存数据?

📅  最后修改于: 2021-05-13 20:40:07        🧑  作者: Mango

当您的应用程序需要脱机工作并且CDN(内容交付网络)将失败时,自动保存数据就会生效。在本文中,我们将访问所需的步骤,这些步骤旨在在脱机时在本地保存您的应用程序,并在建立连接后将其提交。环境设置:在组成使您的应用程序脱机工作的库之前,请确保下载实际文件(例如:angular.js)。例如,我们将有一个名为app.js的基本文件其中包含我们的Angular代码和一个HTML文档,即index.html...

  AngularJS | ng-csp指令

📅  最后修改于: 2021-05-13 20:40:27        🧑  作者: Mango

像互联网上的其他任何内容一样,AngularJS也无法幸免于难。但是,Angular确实提供了来自基本安全漏洞的内置安全性。因此AngularJS旨在与HTTPS(SSL / TLS),CSP等安全措施兼容。ng-CSP指令用于更改AngularJS的安全策略,并在需要时打破CSP(内容安全策略)的许多规则。它还将不会运行任何eval函数,并有助于停止将内联代码注入到应用程序中。当我们为操作系统(...

  如何使用AngularJS设置活动标签样式?

📅  最后修改于: 2021-05-13 20:40:51        🧑  作者: Mango

要使用AngularJS设置活动标签样式,我们需要使用isActive和ng-controller方法。方法1:AngularJS中的ng-controller指令用于向应用程序添加控制器。它可用于添加可以在某些事件(例如click等)上调用的方法,函数和变量,以执行某些操作。句法:下面的示例实现了上述方法:让我们通过一个简单的代码来看一下。这是最简单的方法之一。范例1:输出:方法2:在这里,我们...

  AngularJS | ng-mouseup指令

📅  最后修改于: 2021-05-13 20:41:13        🧑  作者: Mango

AngularJS中的ng-mouseup指令用于在特定HTML元素上发生mouseup事件时应用自定义行为。当按下鼠标按钮时,它可用于显示弹出警报。所有HTML元素都支持它。句法:示例1:本示例使用ng-mouseup指令更改文本效果。输出:离开元素后:单击元素后:示例2:本示例使用ng-mouseup指令显示数组元素。输出:在单击元素之前:单击元素后:...

  如何从Sass元素中仅选择直接子级?

📅  最后修改于: 2021-05-13 20:41:32        🧑  作者: Mango

介绍:Sass是一种脚本语言,已编译为级联样式表(CSS)。它是一种预处理程序语言。它最初由Hampton Catlin设计,然后由Natalie Weizenbaum开发。在初始版本之后,Weizenbaum和Chris Eppstein继续使用SassScript扩展SASS。它支持四种数据类型,分别是数字,字符串,颜色和布尔值。嵌套也可以使用这种语言。有关问题的方法:首先在.html文件中定...

  如何在Angular中将数据从父级传递到子级组件?

📅  最后修改于: 2021-05-13 20:42:03        🧑  作者: Mango

我们可以使用@Input指令将数据从Angular中的Parent传递给Child组件使用输入绑定:@Input –我们可以在子组件内部使用此伪指令来访问父组件发送的数据。在这里,app.component是Parent组件,cdetail.component是child组件。父组件app.component.ts有两个数组。一个用于list_prog –语言列表,prog_details –语言...