AngularDart4.0 指南 原

指南

1.概述

      本文档为Angular的高级部分,如果你刚接触Angular,请先学习Angular。

指南

了解Angular的基础知识,如本地开发的 安装, 显示数据和接受用户输入,构建简单的表单, 将应用程序服务注入到组件中,以及使用Angular的模板语法。

教程

一步一步,沉浸式学习Angular的方法,在应用程序上下文中介绍Angular的主要功能与特点。

高级

Angular特征和开发实践的深入分析。

API

每个Angular库的详细细节。

示例代码 每个页面都包含页面随附的示例应用程序的代码段。 您可以在应用程序中重用这些片段。

参考页 词汇表定义Angular开发人员应该知道的术语。

Cheat Sheet列出了常见场景的Angular语法

API手册是Angular里的公共库的权威向导。

2.开发设置

使用条件:Dart SDK,Dartium(安装sdk时会自动安装)和WebStorm

创建一个启动项目

1.打开WebStorm

2.安装Dart插件并配置sdk目录和Dartium路径

3.从菜单中选择VCS> Git> Clone(前提是安装了Git插件)

4.  填写字段

  • Git Repository URL: https://github.com/angular-examples/quickstart
  • 父目录:( 选择你的目录)
  • 目录名称 angular_tour_of_heroes (或任何其他 有效的包名称

5.单击克隆。

获取依赖关系

在WebStorm中:

  1. 打开新项目。
  2. 在项目视图中,双击pubspec.yaml
  3. 在编辑器视图的右上方pubspec.yaml
    1. 单击 Enable Dart support.
    2. 单击Get dependencies.

     Note:若获取依赖不成功:       1.检查浏览器能否访问pub.dartlang.org.      2.操作系统当前用户对文件的操作权限不足  windows 当前用户对C:\Users(用户)\root(当前用户名)\AppData\Roaming\Pub\Cache\hosted文件夹和项目文件夹没有写入权限。     3.hosts文件包含:127.0.0.1       localhost    4. 若使用了代理(翻墙)软件,webstorm >file>Setting>Appearance &Behavior>System Settings>HTTP Proxy>Manual proxy configuration>SOCKS  一定要和代理提供的域名和端口号一致。 注意:若上述条件满足,出现错误显示 os error "  " errorno=121 address:....  port:....  , 则手动从https://pub.dartlang.org/下载对应包,解压后放在C:\Users(用户)\root(当前用户名)\AppData\Roaming\Pub\Cache\hosted\pub.dartlang.org 目录下。

 WebStorm需要几秒钟来分析来源并进行其他内务处理。这只会发生一次。之后,您可以使用WebStorm进行通常的IDE工作,包括运行应用程序。

如果您不使用WebStorm,可以使用命令行下载依赖项:在终端窗口中,转到项目根目录并运行pub get

自定义项目    使用WebStorm或您最喜欢的编辑器:

    打开web / index.html,并用适合您的应用程序的标题替换<title>元素的文本。 例如:<title>英雄之角</ title>。

   打开pubspec.yaml,并更新描述以适合您的项目。 例如:描述:英雄之旅。

   可选项。 如果您想更改项目的名称,请使用适合您的应用程序的名称进行项目范围的搜索和替换pubspec名称条目(angular_app)的当前值 - 通常它将与 您之前选择的目录名称。

    该项目全局重命名将影响:pubspec.yaml,web / main.dart和test / app_test.dart。

运行应用程序     在WebStorm中:

      在项目视图中,右键单击web / index.html。       选择运行'index.html'。      如果对话框说Chromium想要使用您的机密信息,请单击拒绝。 (您不应该使用Dartium进行通用浏览,Dartium不需要您的信息来运行此应用程序。)

      您应该在Dartium浏览器窗口中看到以下应用程序:

要从命令行运行应用程序,请使用pub serve命令启动Dart编译器和HTTP服务器。 然后,要查看您的应用程序,请使用浏览器导航到pub serve显示的URL。

重新载入应用程式 每当您更改应用程序时,请重新加载浏览器窗口。 当您保存更新代码时,该pub工具会检测更改并提供新的应用程序。

学习Angular 

    你不必阅读文档,如果你是初学者,下方是建议的学习步骤。

    1. 按照开始,通过引导来创建,运行和修改AngularDart应用程序。

    2.参加英雄之旅教程。      英雄之旅让您逐步从安装到全功能的示例,演示了专业应用程序的基本特征:合理的项目结构,数据绑定,主/细节,服务,依赖注入,导航和远程 数据访问。

    3. 查看整体架构图。

    4.阅读数据显示以查看数据绑定是否在屏幕上放置组件属性值。

    5.阅读用户输入,了解如何响应用户启动的DOM事件。

    6.阅读表单,其中涵盖用户界面中的数据输入和验证。

    7.阅读依赖注入,了解如何从小型单用途零件构建大型,可维护的应用程序。

    8.扫描模板语法, AngularHTML模板的综合研究。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏葡萄城控件技术团队

AngularJS应用页面切换优化方案

葡萄城的一款尚在研发中的产品,对外名称暂定为X项目。其中使用了已经上市的Wijmo中SpreadJS产品,另外,在研发过程中整理了一些研发总结分享给大家。如本篇...

26210
来自专栏乐百川的学习频道

Visual Studio Code介绍

应该有很多人都知道Atom编辑器吧,它是由Github开发的一个跨平台的编辑器。它使用了跨平台的Electron,用前端技术编写图形界面。一开始我也推荐过这个编...

2825
来自专栏Jack-Cui

Jetson TX1开发笔记(二):TX1开发前必做的几件事

嵌入式平台: Jeston TX1     在上篇博客中,博主已经使用Jetpack3.0为Jetson TX1刷了最新的系统。但是,在开发前,个人感觉有几个...

3376
来自专栏云计算教程系列

如何在Ubuntu 14.04上使用Fail2Ban保护WordPress

WordPress是一个非常强大的内容管理系统(CMS),是免费和开源的。因为任何人都可以发表评论,创建一个帐户,并在WordPress上发帖,许多恶意行为者已...

1560
来自专栏极客编程

打包利器webpack

Webpack 是一个模块打包器。它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。

972
来自专栏地方网络工作室的专栏

Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(九)再把内容页面渲染出来

Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(九)再把内容页面渲染出来 前情回顾 在上一篇博文《Vue2+VueRou...

22010
来自专栏和蔼的张星的图像处理专栏

2. Nsight Eclipse 连接TX2进行CUDA编程

一开始非常纠结在TX2上怎么写CUDA和opencv的程序,总不能在VIM里敲吧,也许是个神器,但现在可能真的没有时间学习,好在发现了Nsight Eclips...

1962
来自专栏代码拾遗

那些值得一用的JS库

如果你是一个npm作者,强烈推荐使用np模块,它能为你轻而易举地解决更新版本、添加git发布tag和发布代码到npm,特别是当你有很多npm模块要维护的时候。

1723
来自专栏Wordpress专用主机|主题模板|必备插件

腾讯云服务器如何安装宝塔面板

对于很多wordpress爱好者来讲,会优先选择服务器而不是虚拟主机。毕竟服务器在性能以及可控性上很不小的优势。

3.2K10
来自专栏Web 开发

ubuntu学习手札——中文设置,源设置等等最基本的

3. 对于类似“哪个源更快”这样的问题,并没有一个标准答案。每个人的网络状况有不同,不同网站的下载速度对会不同。更改完设置之后,在Software Sour...

861

扫码关注云+社区

领取腾讯云代金券