ng-book2 / book Goto Github PK

Project name "angular2_hello_world" is not valid. New project names must start with a letter, and must contain only alphanumeric characters or dashes. When adding a dash the segment after the dash must also start with a letter.
angular2_hello_world

在mac下没有tree命令,需要 $ brew install tree 安装tree

第10章 第228页 10.3.3小节 Message
根据上下文，code/rxjs/chat/app/ts/models.ts的Message类没有给出代码描述，只有一句:

lastMessage: Message;

1. 书中的样式写为了margin-botton: 20px;
2. 当前版本的代码中code/advanced_components/app/ts/styling/styling.ts第53行也写为了margin-botton: 20px;
3. 应将其一并改为margin-bottom: 20px;

10.2 聊天应用概览的示例

报错提示

If you continue to have issues, please report this full log at https://github.com/Medium/phantomjs
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: `node install.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/xxx/.npm/_logs/2020-05-29T07_13_01_850Z-debug.log

npm/yarn/开代理/无代理都尝试过 还是有问题

label&input 是不是应该改成 id？

有很多种方法可以将数据应用到你的应用之中：
AJAX HTTP请求
Websocket
Indexdb
LocalStorage
LocalStorage
Server Worker

请见引用中的粗体行

第十章 232页 创建类型为Subject的属性newMessages,在方法messagesForThreadUser中执行过滤filter时报错,没有此方法

表单信息验证 "我们通过 myForm.valid 来检查整个表单的验证", 代码却是通过 sku 验证的.

1. 本人使用最新版的angular-cli版本为1.0.1，angular版本为4.0.0
2. 在使用命令ng new angular2_hello_world创建项目时报错，原因大概是新版不支持带下划线_的项目名称，修改为ng new angular2-hello-world后正常。

1. 本页代码部分的方法名为lastChanged()而文章部分为lastChange()
2. 应将文章部分的lastChange()修改为lastChanged()

`import { Component,
OnInit,
Input } from '@angular/core';

@component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
addArticle(title:HTMLInputElement,link:HTMLInputElement):boolean{
console.log('文章标题:${title.value} 链接 : ${link.value}');
return false;
}
}
`

其中:${title.value} 一直不起作用，而我用字符串拼接的方式则可以，百度不得解，不知少安装了什么
初次学习，请大家指导

如果button放在form标签以内 button需要添加type属性,否则默认type为submit

“进入ng命令创建的angular2_hello_world目录...”， 这里的目录名称写的是下划线，实际上是短横杆。应该是笔误，请修正。

位置：3.5.2 组件的输入
错误内容：在讲解组件中inputs配置项时，实例属性名和标签元素属性名写反了。
文中提到：然而，如果我们希望组件实例属性enabled在组件标签中对应的标签元素属性名称为isEnabled，就可以使用上面提到的这个语法：
@component({
//...
inputs: [
'name: name',
'age: age',
'isEnabled: enabled'
]
//...
})
class MyComponent {
name: string;
age: number;
isEnabled: boolean;
}
进一步说，由于只有一个属性需要明确指定从enabled映射到isEnabled，我们可以继续简化：
@Compoent({
//...
inputs: ['name', 'age', 'isEnabled: enabled']
//...
})
class MyComponent {
name: string;
age: number;
isEnabled: boolean;
}
以上两端代码中的'isEnabled: enabled'，均与”我们希望组件实例属性enabled在组件标签中对应的标签元素属性名称为isEnabled“要求不符，应该写成'enabled: isEnabled'。
请雪狼团队审查原书并纠正错误，谢谢！

1. 新增proxy.conf.json配置文件

2. 修改package.json命令

"start": "ng serve --proxy-config proxy.conf.json",

3. 执行

npm start

demo地址 ->

如题，页面的top部分，为什么不显示呢？按照书里的步骤复制过去，index.html都是一样的，app.component.html也是一个form表单，但是页面只显示了这个表单，index.html的内容没有显示。我的版本是：
@angular/cli: 1.2.6

http://weblog.jamisbuck.org/2016/10/18/skinny-controller-fat-model

没有请求不成功的情况了，

https://github.com/twolun/ng-book-4/tree/master/http

在书本的第36页，1.9 渲染多行
在此章节创建了一个Article类，在第39页中修改Article组件代码中，并未使用import{}from 来引入类，读者学习使用中注意不到这一点，会导致页面报错，而毫无头绪，希望能加以修正。

Flux作为一种模式而并非具体实现 ...... 这一行内容应与后面 内容排版一致，根据英文版 最后两行应归为一行内容

可观察对象 observable 英文首字母大写 Observable

在1.9小节-88页，书中直接在constructor中初始化this.article，导致在加载页面的时候，this.article找不到，undefined，页面展示异常
应该把初始化操作this.article赋值操作放于ngOnInit中操作，constructor意为在类生成实例时调用，适用于依赖注入，所注入的可作为类的属性来使用。而ngOnInit则是angular规定的初始化操作的地方。

code/first_app/angular2_reddit/src/app/article/article.component.ts
export class ArticleComponent implements OnInit {
article: Article;
constructor() {
this.article = new Article(
'Angular',
'http://angular.io',
10);
}
voteUp(): boolean {
this.article.voteUp();
return false;
}
voteDown(): boolean {
this.article.voteDown();
return false;
}
ngOnInit() {
}
}

中文版第102页 第2行 ngNodBindable 改为 ngNonBindable

根据上下文和内容 ”你可以点击会话（thread）和一个机器人聊天” 改为 你可以点击会话（thread）和另一个人聊天 会比较合适

第一句话 原话为 “使用ngForm和ngControl隐式构建FormControl和FormGroup确实很方便，但无法为我们提供
更多定制化选项。”
而在5.4之前的章节中没有提到ngControl，而根据之前的例子实验，这句话应修改为
“ 使用ngForm和ngModel隐式构建FormControl和FormGroup确实很方便，但无法为我们提供
更多定制化选项。”

210页自己创建注入器描述不清晰

<img src="{{ product.imageUrl }}"
这种写法也可以正常加载图片，{{ product.imageUrl }}并未被解析为字符串