AngularJs中模块的依赖注入,ng-model、ng-bind和{{}}的区别,路由机制

AngularJS的四大核心特性

<1>MVC

<2>模块化和依赖注入

<3>双向数据绑定

<4>指令

1、模块的注入和依赖

var bookStoreApp = angular.module(&#39;bookStoreApp&#39;, [
&#39;ngRoute&#39;, &#39;ngAnimate&#39;, &#39;bookStoreCtrls&#39;, &#39;bookStoreFilters&#39;,
&#39;bookStoreServices&#39;, &#39;bookStoreDirectives&#39;
]);

2、ng-bind是从$scope -> view的单向绑定

ng-modle是$scope <-> view的双向绑定

{{}}

一直不明白它们几个的区别,看了视频明白了,其实ng-bind和{{}},没有啥区别,只是二者使用的情景不是很一样,一般情况下,建议ng-bind在首页加载的时候使用,{{}}建议是首页意外的页面使用,因为双括号{{}}在加载的时候,若网速不好或者首页还未加载angular库时,其会显示出来,这样用户在使用时,会感觉页面不是特别美观,既然存在这个问题,以后在写的时候,还是注意点.

<div>
<input ng-model="greeting.text"/>
<p>{{greeting.text}},Angular</p>
</div>

3、在项目的开发过程中,我们会用到angular的路由,这也是angular的核心,但是angular本身自带的路由机制一般无法满足项目的需求,它不能实现路由的深层次嵌套,所以我们会引入angular-ui-router,angular自带的路由机制和我们引入的ui-router在使用的时候有小部分区别,但是重点都是一样的。

下面给出引入ui-router的部分代码

bookStoreApp.config(function($routeProvider) {
$routeProvider.when(&#39;/hello&#39;, {
templateUrl: &#39;tpls/hello.html&#39;,
controller: &#39;HelloCtrl&#39;
}).when(&#39;/list&#39;, {
templateUrl: &#39;tpls/bookList.html&#39;,
controller: &#39;BookListCtrl&#39;
}).otherwise({
redirectTo: &#39;/hello&#39;
})
});
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值